2013-08-14 2 views
0

Я использую jquery ajax для вызова метода действий, который вернет ViewModel, как я могу обновить диаграмму Telerik для отображения возвращенных данных?Обновить диаграмму MVC Telerik с помощью jquery ajax

Вот что я до сих пор:

Javascript:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $(".GenerateCharts").live('click', function() { 
      $("#imgprogress").css("display", "block"); 
      var monthVar = $("#chartMonth").val(); 
      var yearVar = $("#chartYear").val(); 
      //************************************ 
      $.ajax({ 
       type: "POST", 
       url: '@Url.Action("MyCharts", "Charts")', 
       data: JSON.stringify({ selectedMonth: monthVar, selectedYear: yearVar, chartId: 1 }), 
       success: function() { 
        $("#TargetChart").data("tChart").refresh(); // <-- Didn't work! 
       }, 
       dataType: "json", 
       contentType: "application/json" 
      }); 

      $("#imgprogress").css("display", "none"); 
     }); 
    }); 
</script> 

Telerik Диаграмма:

@(Html.Telerik().Chart(Model.QueueTimeViewModel.QueueTimeMonth) 
    .Name("TargetChart") 
    .Title("Chart[1]") 
    .Legend(legend => legend.Position(ChartLegendPosition.Bottom)) 
    .Series(series => 
      { 
       series.Column(model => model.ImmigrationTime).Name(APMS.Resources.InspectionReports.Resource.ImmigrationAverage).Labels(label => label.Visible(true)).Color("#00ff00"); 
       series.Column(model => model.TransitTime).Name(APMS.Resources.InspectionReports.Resource.TransitAverage).Labels(label => label.Visible(true)).Color("#FF0000"); 
       series.Column(model => model.StaffTime).Name(APMS.Resources.InspectionReports.Resource.StaffAverage).Labels(label => label.Visible(true)).Color("#F09800"); 
       series.Column(model => model.TargetTime).Name(APMS.Resources.InspectionReports.Resource.Target).Labels(label => label.Visible(true)).Color("#0000ff"); 
      }) 
    .CategoryAxis(axis => axis 
        .Categories(" ") 
        .Line(line => line.Visible(true)) 
        .Labels(labels => labels.Padding(0, 0, 0, 0))) 
        .ValueAxis(axis => axis 
        .Numeric().Labels(labels => labels.Format("{0} min"))) 
     .Tooltip(tooltip => tooltip 
        .Visible(true) 
        .Format("{0}") 
        .Template("<#= series.name #>: <#= value #> min")) 
     .HtmlAttributes(new { style = "width: 600px; height: 400px; z-index:-1;" })) 
+0

Когда вы говорите, что возвращает ViewModel, вы имеете в виду, что он возвращает необработанный набор данных или он возвращает некоторый визуализированный HTML для отображения ViewModel? – asymptoticFault

+0

@asymptoticFault возвращает необработанные данные – SVI

+0

Ok. Я не знаком с помощниками Telerik, поэтому у их плагина есть функция, с которой вы можете предоставить данные? Я заметил, что вы вызываете 'refresh()' в плагине, но что это делает? – asymptoticFault

ответ

0

Вам нужно что-то делать с данными АЯКС ответа. Ваша функция успеха должна иметь параметр данных следующим образом:

success: function (data) { 

Вы можете обновить диаграмму с в зависимости, что данные о том, что это точно.

Если у плагина нет возможности предоставить ему новые данные для обновления диаграммы, то я бы сказал, что было бы проще и, вероятно, лучше перерисовать диаграмму на сервере и просто отправить обратно HTML вместо данных. С точки зрения лучшей практики это было бы лучше, потому что это оставило бы логику представления в представлении Razor вместо полного или частичного дублирования его на клиенте с помощью javascript.

 Смежные вопросы

  • Нет связанных вопросов^_^