Может ли кто-нибудь опубликовать демонстрацию или фрагмент кода, чтобы показать, как использовать jqpivot и загружать данные с помощью ajax. Спасибо.
JqPivot и загрузка данных по ajax
Ответы (1)
Я бы порекомендовал вам изучить исходный код бесплатного jqGrid. Посмотрите на часть кода. Это выглядит как
jqPivot: function (data, pivotOpt, gridOpt, ajaxOpt) {
return this.each(function () {
var $t = this, $self = $($t), $j = $.fn.jqGrid;
function pivot(data) {
...
}
if (typeof data === "string") {
$.ajax($.extend({
url: data,
dataType: "json",
success: function (data) {
pivot(jgrid.getAccessor(data, ajaxOpt && ajaxOpt.reader ? ajaxOpt.reader : "rows"));
}
}, ajaxOpt || {}));
} else {
pivot(data);
}
});
}
Вы получите практически сразу ответ на свой вопрос. Вам необходимо указать URL-адрес сервера, который предоставляет входные данные в формате JSON. Никакой другой формат данных ("xml"
, "jsonp"
и т. д.) напрямую не поддерживается, но вы можете использовать параметр ajaxOpt
для перезаписи параметров вызова Ajax. Важно дополнительно понимать, что jqGrid использует метод $.jgrid.getAccessor
для чтения данных из ответа сервера. Формат данных по умолчанию должен быть следующим:
{
"rows": ...
}
где значение "rows" должно иметь тот же формат, что и параметр data
для jqPivot
, если вы используете if без Ajax. Если у вас есть, например
{
{
"myRoot": {
"myData": ...
}
}
}
то вы можете использовать 4-й параметр jqPivot (ajaxOpt
) как
{ reader: "myRoot.myData" }
Если ответ сервера представляет собой массив данных:
[
...
]
или он имеет нестандартную форму, чем вы можете использовать функциональную форму reader
. Например
$("#grid").jqGrid("jqPivot", "/myUrl", {
xDimension: [{...}],
yDimension: [{...}, ...],
aggregates: [{...}],
},
{
iconSet: "fontAwesome",
cmTemplate: { autoResizable: true, width: 80 },
shrinkToFit: false,
autoResizing: { compact: true },
pager: true,
rowNum: 20,
rowList: [5, 10, 20, 100, "10000:All"]
},
{
reader: function (obj) { return obj; },
contentType: "application/json; charset=utf-8",
type: "POST",
error: function (jqXHR, textStatus, errorThrown) {
alert('HTTP status code: ' + jqXHR.status + '\n' +
'textStatus: ' + textStatus + '\n' +
'errorThrown: ' + errorThrown);
alert('HTTP message body (jqXHR.responseText): ' + '\n' + jqXHR.responseText);
}
});
Приведенный выше код указывает читателю функцию, которая напрямую использует все данные ответа (без объекта со свойством rows
). Он определяет параметры contentType
и type
файла jQuery.ajax и функцию обратного вызова error
.
Если все параметры кажутся вам слишком сложными, вы можете загрузить данные прямо в свой код, например, с помощью прямого вызова jQuery.ajax
и вызова jqPivot
после загрузки данных (внутри обратного вызова success
или done
).