4

Primeiramente peço desculpas pelo meu desconhecimento de alguns conceitos, sou novo na área. Comecei recentemente em uma empresa no qual tenho o seguinte problema:

Tenho um Datepicker e ao selecionar uma data, preciso que o gráfico seja alterado conforme a data selecionada.

Já implementei alguns campos onde as estatísticas mudam conforme a data escolhida, utilizando POST. Tentei fazer algo similar retornando uma WebImage ou um Chart pelo controller porém o gráfico aparece em branco.

View:

img id="graf" src="@Url.Action("DrawChartMaq", new { id = Model.maq_id })"

$(document).ready(function () {

    $("#periodo").datepicker({

        dateFormat: 'dd/mm/yy',

        nextText: 'Próximo',

        prevText: 'Anterior',

        onClose: function (selectedDate){

            $("#jquery").html(selectedDate);

            var url = "/Efc_Maquina/SetarDatePicker";

            var xurl = "/Efc_Maquina/DrawNewChart";

            var dia = selectedDate;

            var id = @Model.maq_id;

            $.post(url, { Datatexto: dia, choose: 1, id: id}, function(data) {
                $("#estat1").html(data);
            })

            $.post(url, { Datatexto: dia, choose: 2, id: id}, function(data) {
                $("#estat2").html(data);
            })

            $.post(xurl, { Datatexto: dia, id: id }, function(image){
                $("#graf").attr('src', image);
            })

Controller:

public Chart DrawNewChart(string Datatexto, int? id)
{

    DateTime data = DateTime.Parse(Datatexto);

    ArrayList xvalue = new ArrayList(); // valores puxados do BD
    ArrayList yvalue = new ArrayList(); // valores puxados do BD           

    return new Chart(width: 800, height: 400)
       .SetXAxis("", 9, 18)
       .SetYAxis("", 0, 100)
       .AddSeries("Defa", chartType: "Column", xValue: xvalue, yValues: yvalue)
       .Write("bmp");

}

Agradeço desde já.

...Como tinha dito sou novo na área e provavelmente não utilizei as ferramentas corretamente e não tenho certeza se a solução que achei é a mais correta porém vou compartilhar. Não tinha necessidade de mudar as estatísticas e gráfico sem atualizar a página, então resolvi o meu problema redirecionando para a mesma Action Details em que eu estava, passando os parâmetros necessários para gerar estatísticas e gráfico com a data selecionada. Não sei se estou correto mas acredito que para redirecionar quando selecionada a data, não seria necessário estar dentro do POST, vou procurar me informar sobre isso.

$.post("/Controller/View", { id: id, Datatexto: dia }, function (image) {
                        window.location.href = "/Controller/View/" + id + "?Datatexto=" + dia;})
2
  • Qual o formato de retorno do Controller? É um html mesmo? Acredito que talvez o que deseje seja algo neste sentido: jsfiddle.net/gh/get/jquery/1.9.1/highslide-software/…
    – rodrigorf
    Commented 7/11/2016 às 19:54
  • 1
    No Controller faço o gráfico com as informações do banco de dados utlizando o Helper Chart : img id="graf" src="@Url.Action("DrawChartMaq", new { id = Model.maq_id })" . Até aí tudo bem, ele aparece como desejo na View em html. Porém preciso que ele mude dinamicamente conforme a data selecionada. Para isso tentei implementar uma nova função no Controller retornando um Chart ou WebImage. O gráfico muda porém aparece uma nova imagem em branco. @rodrigorf Commented 8/11/2016 às 10:36

1 Resposta 1

2

Pesquisa sobre o Ajax do JQuery eu uso muito para fazer isso. E tenta mudar o evento do date picker para onSelect No seu caso ficaria mais ou menos assim:

onSelect: function(dateText, inst) {
$.ajax({
url: '/Efc_Maquina/DrawNewChart',
type: 'POST',
datatype: 'application/text',
data: { Datatexto: dia, id: id }, //Parametros
success: function (data) {
    //Aqui vc trabalhao o retorno do servidor em caso de sucesso

    //Acredito q o retorno dessa chart seja o endereço de uma imagem certo?
     $("#graf").attr('src', data);
    },
error: function (xhr, status, error) {
   //Aqui vc trata algum erro retornado do servidor
},
complete: function (data) {
//Aqui vc executaria alguma ação ao finalizar esse processo
}
});
}

Testei algum com um método ficticio me retornando um diretorio de imagem e funcionou perfeitamente.. Atualiza a imagem...

Agr se no caso esse chart for algum outro objeto.. Como Canvas teria de usar outra tag ao invés de img.

Você deve fazer log-in para responder a esta pergunta.

Esta não é a resposta que você está procurando? Pesquise outras perguntas com a tag .