JqPivot и загрузка данных с помощью ajax

Question

Может кто-нибудь опубликовать демонстрацию или фрагмент кода, чтобы показать, как использовать jqpivot и загружать данные с помощью ajax. Спасибо.

Answer 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": ...
}

где значение "строк" ​​должно иметь тот же формат, что и data параметр jqPivot если вы используете, если без 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).