我使用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>
有人可以给我一个满足我需求的帮助,小费或教程,因为通过我做的研究,我找不到解决方案。
由于