JqG​​rid无法使用json

时间:2016-08-04 18:41:06

标签: javascript jqgrid jqgrid-asp.net

我使用jqGrid和json数据类型,但是我不能让它分页工作。 我研究过并没有找到任何解决方案,有人可以暗示一下, 请问前进的道路?

var sourceOrigemPagamento = null;
var dataAdapterOrigemPagamento = null;

$(document).ready(function () {

SourceCamposGridOrigemPagamento();

ConfiguracaoGridOrigemPagamento();
});

function SourceCamposGridOrigemPagamento() {
sourceOrigemPagamento = {
    datatype: "json",
    datafields: [
        { name: 'OrigemPagamentoID', type: 'number' },
        { name: 'Descricao', type: 'string' },
        { name: 'CadastroData', type: 'date' },
        { name: 'AtualizacaoData', type: 'date' },
    ],
    url: "/OrigemPagamento/ListarJsonPaginado",
    data: {},
    async: false,
    filter: function () {
        $("#grid").jqxGrid('updatebounddata', 'filter');
    },
    sort: function () {
        $("#grid").jqxGrid('updatebounddata', 'sort');
    },
    beforeprocessing: function (data) {
        sourceOrigemPagamento.totalrecords = data.TotalRows;
    },
};

dataAdapterOrigemPagamento = new $.jqx.dataAdapter(sourceOrigemPagamento, {
    contentType: 'application/json; charset=utf-8'
});
}

function ConfiguracaoGridOrigemPagamento() {

var cellsrenderer = function (row, columnfield, value, defaulthtml,   columnproperties) {
    debugger;
    return "<div class=\"well\" style=\"padding: 4px;\">" +
            "<div class=\"btn-group btn-group-justified\">" +
            "<a href=\"#\" onclick=\"loadURL('OrigemPagamento/Editar/" + value + "', $('#content'))\" class=\"btn btn-xs btn-primary\">" + localizarRecurso(MensagensSistema.Editar) + "</a>" +
            "<a href=\"#\" onclick=\"RemoverRegistro('OrigemPagamento/Remover'," + value + ")\" class=\"btn btn-xs btn-primary\">" + localizarRecurso(MensagensSistema.Remover) + "</a>"
        "</div>" + "</div>";
};

$("#grid").jqxGrid({
    width: '100%',
    autoheight: true,
    source: dataAdapterOrigemPagamento,
    pageable: true,
    pagesizeoptions: ['10', '25', '50'],
    sortable: true,
    filterable: true,
    showfilterrow: true,
    columnsmenu: false,
    pagesize: 10,
    columnsheight: 29,
    rowsheight: 29,
    theme: theme,
    localization: mensagensJQGrid,
    virtualmode: true,
    editable: false,
    rendergridrows: function (obj) {
        return obj.data;
    },
    columns: [
        { text: localizarRecurso(MensagensOrigemPagamento.Descricao), datafield: 'Descricao', width: '30%', },
        { text: localizarRecurso(MensagensOrigemPagamento.CadastroData), datafield: 'CadastroData', width: '30%', filtertype: 'range', cellsformat: 'dd/MM/yyyy', align: 'center', cellsalign: 'center', },
        { text: localizarRecurso(MensagensOrigemPagamento.AtualizacaoData), datafield: 'AtualizacaoData', width: '30%', filtertype: 'range', cellsformat: 'dd/MM/yyyy', align: 'center', cellsalign: 'center', },
        { text: localizarRecurso(MensagensOrigemPagamento.Acoes), datafield: 'OrigemPagamentoID', width: '10%', cellsalign: 'center', filterable: false, sortable: false, cellsrenderer: cellsrenderer }
    ],
});
}

$("#bttClearFilter").click(function () {
$("#grid").jqxGrid('clearfilters');
});

$("#hide-menu a").click(function () {
$("#grid").jqxGrid('updatebounddata');
});

这是我的HTML

@Scripts.Render("~/bundles/GestorWeb/OrigemPagamento")

<div class="table-responsive" style="font-size: 11px;align-content: center;    overflow:hidden; border: solid 1px #CCC; border-radius: 3px;">
<div id="grid"></div>
</div>

有人可以给我一个满足我需求的帮助,小费或教程,因为通过我做的研究,我找不到解决方案。

由于

0 个答案:

没有答案