JQPlot, JSON и ошибка "Данные не указаны"

Спасибо @Fresh за быстрый ответ. Вот полное решение моей проблемы:

Код для прослушивания нажатия кнопки:

$(document).ready(function () {
 $('#<%=btnASMX1.ClientID%>').click(function () {
  getElectricDataJSON();
 return false;
 });
});

JS-функция для получения данных из веб-службы:

function ajaxDataRenderer() {
 var ret = null;
 $.ajax({
  // have to use synchronous here, else the function 
  // will return before the data is fetched
  async: false,
  type: 'POST',
  contentType: 'application/json; charset=utf-8',
  url: "AccountsService.asmx/GetJSONData",
  data: "{AccountID: " + $('#<%= hiddenAccountID.ClientID%>').val() + " }",
  dataType: "json",
  success: function (response) {
    ret = response.d; // return response string object
  },
  error: function (request) {
   $('#<%=outputASMX.ClientID%>').html("<div style='color:red;'>WEBSERVICE    UNREACHABLE</div>");
  }
 });
 return ret;
};

Структура данных, выводимая веб-службой, следующая:

[ { "todate": "2013-09-23T00:00:00", "Bill": 7,095.65 }, { "todate": "2013-08-22T00:00:00", "Bill": 1,137.96 }, { "todate": "2013-07-24T00:00:00", "Bill": 220,429.41 }, ... ]

Структура данных, которую ожидает JQPlot:

[ [ "2013-09-23T00:00:00", 7095.65 ] , [ "2013-08-22T00:00:00", 1137.96 ], [ "2013-07-24T00:00:00", 220429.41 ], ... ]

Обратите внимание на удаление запятой в поле Bill "Ожидаемые данные".

И, наконец, функция getElectricDataJSON (), которая вызывается btnASMX1, где 'chart2' - это идентификатор тегов div, в которых будет отображаться диаграмма.

function getElectricDataJSON() {

 // Get JSON 'string' object
 var ret = ajaxDataRenderer();

 // If JSON string object is null, stop processing with friendly message
 if (ret == null) {
   $('#<%=outputASMX.ClientID%>').html("<div style='color:red;'>CHARTS ARE NOT AVAILABLE AT THIS TIME</div>");
   return false;
 }

 // Now push required data into a JSON array object
 var sampleData = [], item;
 $.each(ret, function (key, value) {
   sampleData.push([value.todate, parseFloat(value.Bill.replace(/,/g, ""))]);
 });

 var plot = $.jqplot('chart2', [sampleData], {
   title: 'AJAX JSON Data Renderer',
   dataRenderer: sampleData,
   ...      
 });
}

Сигнатура метода для вашего средства хранения данных (например, ajaxDataRender) неверна. Подпись должна выглядеть так:

function (userData, plotObject, options) {... вернуть данные; }

(См. Документацию здесь)

В вашем примере вы передаете datarenderer "ret", который не является функцией с правильной подписью datarenderer. Также jsonurl, который вы передаете в getElectricDataJSON (), является избыточным, так как ни в одном месте вашего кода данные из «AccountsService.asmx / GetJSONData» не сохраняются в «./jsondata.txt».

Следовательно, вы должны изменить свой код на этот:

$(document).ready(function(){
 function ajaxDataRenderer(url, plot, options) {
  var ret = null;
  $.ajax({
   // have to use synchronous here, else the function 
   // will return before the data is fetched
   async: false,
   url: url,
   dataType: "json",
   success: function (response) {
    var ret = response;
    // The following two lines just display the JSON data for testing purposes
    $('#<%=outputASMX.ClientID%>').empty();
    $('#<%=outputASMX.ClientID%>').html("<div>" + ret + "</div>");
   },
   error: function (request) {
    $('#<%=outputASMX.ClientID%>').html("<div style='color:red;'>WEBSERVICE UNREACHABLE</div>");
   }
  });
  return ret;
 };

 var url = "AccountsService.asmx/GetJSONData";

 function getElectricDataJSON() {
  var plot1 = $.jqplot('chart2', url, {
  title: "AJAX JSON Data Renderer",
  dataRenderer: ajaxDataRenderer,
 });
}