I try to use two different jqgrid on the same page with the mvc application, tables are using diferent URL to load data and diferent names. It's possible use multiple jqgrid on same page!?!?
Thanks in advance
UPDATED: First thanks for the quick response
The problem continue after I've change the ids as you told me!
Here is my code:
Javasrcipt :
First Grid :
jQuery("#listMedicosTODO").jqGrid({
url: '/Medico/LoadToDoMedicos/',
datatype: 'json',
mtype: 'GET',
colNames: ['Cod.', 'Titulo', 'Estado', 'Ultima Actualização'],
colModel: [
{ name: 'CodRelatorio', index: 'CodRelatorio', width: 50, align: 'center', hidden: true, sortable: false },
{ name: 'TituloRelatorio', index: 'TituloRelatorio', width: 100, align: 'center', sortable: true },
{ name: 'EstadoRelatorio', index: 'EstadoRelatorio', width: 100, align: 'left', sortable: false },
{ name: 'DataUltimaActualizao', index: 'DataUltimaActualizao', width: 100, align: 'left', hidden: false, sortable: false }
],
pager: jQuery('#pager1'),
rowNum: 50,
rowList: [50],
sortname: 'Id',
sortorder: "asc",
viewrecords: true,
imgpath: '/scripts/themes/steel/images',
caption: 'Tarefas Pendentes Médicos',
onSelectRow: function (id) {
var data = $("#listMedicosTODO").getRowData(id);
alert("select row " + data.CodRelatorio);
},
loadComplete: function (data) {
alert("Load Complete");
//$('#list').setGridParam({ url: '/PesquisarRelatorios/GetGridData/' });
},
gridComplete: function () { alert("Grid Complete"); },
beforeRequest: function () { },
viewrecords: true,
autowidth: true,
autoheight: true
}).navGrid(pager, { edit: false, add: true, del: true, refresh: true, search: false });
Second Grid :
jQuery("#listaAssistentesTODO").jqGrid({
url: '/Medico/LoadToDoAssistentes/',
datatype: 'json',
mtype: 'GET',
colNames: ['Cod.', 'Titulo', 'Assistente', 'Estado', 'Ultima Actualização'],
colModel: [
{ name: 'CodRelatorio', index: 'CodRelatorio', width: 50, align: 'center', hidden: true, sortable: false },
{ name: 'TituloRelatorio', index: 'TituloRelatorio', width: 100, align: 'center', sortable: true },
{ name: 'Assistente', index: 'Assistente', width: 100, align: 'center', sortable: false },
{ name: 'EstadoRelatorio', index: 'EstadoRelatorio', width: 100, align: 'left', sortable: false },
{ name: 'DataUltimaActualizao', index: 'DataUltimaActualizao', width: 100, align: 'left', hidden: false, sortable: false }
],
pager: jQuery('#page2'),
rowNum: 50,
rowList: [50],
sortname: 'CodRelatorio',
sortorder: "asc",
viewrecords: true,
imgpath: '/scripts/themes/steel/images',
caption: 'Tarefas Pendentes Assistentes',
onSelectRow: function (id) {
var data = $("#listaAssistentesTODO").getRowData(id);
alert("select row " + data.CodRelatorio);
},
loadComplete: function (data) {
alert("Load Complete");
//$('#list').setGridParam({ url: '/PesquisarRelatorios/GetGridData/' });
},
gridComplete: function () { alert("Grid Complet"); },
beforeRequest: function () { },
viewrecords: true,
autowidth: true,
autoheight: true
}).navGrid(pager, { edit: false, add: true, del: true, refresh: true, search: false });
Server endpoint :
1º
if(list != null)
{
int pageIndex = Convert.ToInt32(page) - 1;
int pageSize = rows;
int totalRecords = list.Count ;
var totalPages = (int)Math.Ceiling(totalRecords / (float)pageSize);
var jsonData = new
{
total = totalPages,
page,
records = totalRecords,
rows = (from item in list
select new
{
i ="a" + item.CodRelatorio,
cell = new[]
{
item.CodRelatorio ,
item.TituloRelatorio,
item.Assistente ,
"Em Elaboração",
item.DataUltimaActualizao
}
}).ToArray()
};
return Json(jsonData,JsonRequestBehavior.AllowGet);
}
2º end point
if (list != null)
{
int pageIndex = Convert.ToInt32(page) - 1;
int pageSize = rows;
int totalRecords = list.Count;
var totalPages = (int)Math.Ceiling(totalRecords / (float)pageSize);
var jsonData = new
{
total = totalPages,
page,
records = totalRecords,
rows = (from item in list
select new
{
i = "b"+ item.CodRelatorio,
cell = new[]
{
item.CodRelatorio ,
item.TituloRelatorio,
"Em Elaboração",
item.DataUltimaActualizao
}
}).ToArray()
};
return Json(jsonData, JsonRequestBehavior.AllowGet);
This code contain your recomendations
Thanks