Develop Reference

jqGrid gridComplete error reloadGrid on loadcomplete

I was doing some tests and i want to move to another on loadlComplete in, but the grid dont reload.
If i exectue this statement on firebug the grid reload: jQuery("#participations").jqGrid('setGridParam',{page:2}).trigger("reloadGrid");
Why this dont work on loadcomplete?
jQuery("#participations").jqGrid({url:'bd/getParticipations_pageable.php',
datatype: "json",
postData:{contestId:contestId},
width:920,
height: "auto",
scrollOffset:0,
colNames:['','Participação', 'Email','Nome','Telemóvel'],
colModel:[
{name:'id',index:'id', width:210, sorttype:'int', hidden:false, sortable:false},
{name:'participation',index:'participation',sortable:false},
{name:'email',index:'email',width:35,sortable:false},
{name:'name',index:'name',width:35,sortable:false},
{name:'moreInfoBtn',index:'moreInfoBtn', width:43,sortable:false}
],
rowNum:15,
hidegrid: false,
pager: '#participationsPager',
sortname: 'id',
sortorder: "desc",
caption:"Participações",
gridComplete: function(){
var ids = jQuery("#participations").jqGrid('getDataIDs');
var rows = jQuery("#participations").jqGrid('getRowData');
var mydata = $("#participations").jqGrid('getGridParam','data');
jQuery("#participations").jqGrid('setGridParam',{page:2}).trigger("reloadGrid");
}
,loadComplete:function(){
},
}).navGrid("#participationsPager",{edit:false,add:false,del:false,search:false});

How to show json array value in jqgrid

I am trying to pass the array value into jqgrid. As follows, the "ranking" value is another array, I would like to put each element (rank and score) in the array in a separate column:
Javascript:
$(document).ready(function(){
jQuery("#ggp_info").jqGrid('GridUnload');
jQuery("#ggp_info").jqGrid({
data: jsonObj.entry,
datatype: "local",
colModel:[
{name:'id',index:'id', width:55, align:"center"},
{name:'name',index:'name', width:110, align:"center"},
{name:'sort',index:'sort', width:50, align:"center"},
{name:'ranking.rank',index:'ranking.rank', jsonmap:'ranking.rank', width:250, align:"center"}
],
rowNum:7,
sortname: 'id',
viewrecords: true,
sortorder: "desc",
height: "100%",
shrinkToFit: false,
caption:"Leaderboard"
});
});
The jsonObj value is as follows:
{"entry":
[{"id":"10000935","name":"Queen","sort":"0","ranking":[{"rank":"1","score":"60"}]},
{"id":"10000936","name":"Level1","sort":"0","ranking":[{"rank":"1","score":"700"}]}]

First you have to parse your json object and split it to retrieve separated rank and score
Then you have to create two columns like the following:
{name:'rank',index:'rank', editoptions:{value:rankArray}}
{name:'scores',index:'scores', editoptions:{value:scoresArray}}
So you will put ranks in rankArray and scores in scoresArray

jqGrid not showing rows, only shows total number of rows

I'm having a problem that I can't sort it out.
Please take a look at this image first
As you can see, I have been able to request the JSON data from server. The pager shows that there were 4 records. But the records didn't shows in the table.
This is my javascript code
jQuery("#pickFlex66").jqGrid({
url: root + '<?=$mod?>' + '/listpicker',
datatype: "json",
altRows: true,
mtype: 'POST',
colNames:['Code','Company Name'],
colModel:[
{name:'company_code',index:'company_code', width:100},
{name:'company_name',index:'company_name', width:100}
],
rowNum:10,
width: 540,
height: 310,
rowList:[10,20,30],
pager: '#pagerFlex66',
sortname: 'company_code',
shrinkToFit: false,
viewrecords: true,
sortorder: "desc",
caption:"<?=lang("users_title")?>",
onSelectRow: function(id){
}
});
jQuery("#pickFlex66").jqGrid('navGrid','#pagerFlex66',{edit:false,add:false,del:false,search:false});
And here is my JSON data
{
"page": "1",
"total": 0,
"records": "4",
"rows": [{"id":"5","cell":["55-123","123"]},{"id":"3","cell":["123","IBM"]},{"id":"2","cell":["00000","BDO"]},{"id":"1","cell":["000-00","IT GROUP Inc "]}]
}
Is there a mistake in my javascript? Or maybe in my JSON data?

I agree with Briguy37 that the value "total": 0 is strange and of cause incorrect. Nevertheless jqGrid should do display all data.
I suppose that you have the problem in the part of your code which you not posted here. How you can see from the demo the code which you posted can do read and display the JSON data.

Here's a couple issues...haven't figured out why your results aren't getting populated yet, though:
Total in your returned JSON should be the number of pages. Because it is set to 0, that is why it is displaying 0. Also, you'll probably want to return rowCount as 10 in case you change the number of results per page.

You are missing a json reader, I had the exact same problem.
$("#list").jqGrid({
url : "my-json-table-action' />",
datatype: 'json',
jsonReader: {
root: 'gridModel',
id: 'idTT',
repeatitems: false,
},
resize: false,
hidegrid: false,
data: 'trabajosTerminales',
mtype: 'POST',
height: 'auto',
colNames:['No. de Registro', 'Título', 'Tipo', 'Periodo'],
colModel :[
{name:'numRegistro', index:'titulo', search: 'true', stype:'text', align:'center' searchrules:{required:true}, width:100 },
{name:'titulo', key:'true', index:'titulo', search: 'true', stype:'text', searchrules:{required:true}, width:800 },
{name:'tipo', key:'true', index:'tipo', search: 'true', stype:'text',align:'center', searchrules:{required:true}, width:100 },
{name:'periodo', key:'true', index:'titulo', search: 'true', stype:'text', searchrules:{required:true}, width:100 },
],
pager: '#pager',
rowNum:10,
rowList:[10,20,30],
viewrecords: true,
gridview: true,
caption: 'Trabajos Terminales dirigidos',
});
jQuery("#list").navGrid('#pager',{edit:false,add:false,del:false});
});
Where the root element is the array that contains your data, in this case I'm returning my data in an array called 'gridModel', the id is not necessary. But you have to make sure to set the root element right, in your case it's called 'rows' instead 'gridModel'.

gqgrid ajax data load on edit

i have jqgrid with the following structure :
jQuery("#frmac").jqGrid({
url:'manage_groups_controller.php?module=group',
datatype: "json",
colNames:[ ' ' , 'Id', 'Pays' , 'Category', 'SubCategory','Hidden','Group name','Title', 'Libelle','Etat', 'Pds'],
colModel:[
{name: 'myac', width:100, fixed:true, sortable:false, resize:false, formatter:'actions', formatoptions:{keys:true}},
{name:'id', key : true, index:'id',width:50},
{name:'country',index:'country_id' ,edittype:'select', editoptions:{value:{32:'Belgique',1000:'Canada',33:'France', 352:'Luxembourg',41:'Suisse'}},width:50 , editable :true},
{name:'category', index:'category_id', editable :true,width:80,edittype:'select',editoptions: {dataUrl:'manage_groups_controller.php?module=category',dataEvents :[{ type: 'change', fn: function(e) {var thisval = $(e.target).val();$.get('manage_groups_controller.php?module=subcat&catid='+thisval, function(data){$("#subcategory_id").html(data);});}}]}},
{name:'subcategory',index:'subcategory_id', editable :true,width:100,edittype:'select',editoptions: {dataUrl:'manage_groups_controller.php?module=subcat&catid='}},
{name:'hidden',index:'hidden',width:60,edittype:'select', editable :true,editoptions:{value:{O:'Oui',N:'Non'}}},
{name:'group',index:'nom_group',width:250},
{name:'title',index:'title',width:300,editable:true, edittype:'textarea',editoptions: {rows:"5",cols:"27"},editrules:{required:true}},
{name:'libelle', index:'libelle',width:300,editable:true, edittype:'textarea',editoptions: {rows:"5",cols:"27"},editrules:{required:true}},
{name:'etat', index:'etat', editable :true,width:30,edittype:'select', editoptions:{value:{A:'Active',D:'Desactive'}}},
{name:'pds', index:'pds', editable :true,width:30,editrules:{required:true},formatter:'integer'}
],
rowNum:10, width:700,
rowList:[10,20,30],
pager: '#pfrmac',
sortname: 'id',
viewrecords: true,
sortorder: "asc",
jsonReader: { root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: true,
cell: "cell"
} ,
caption: "Gestion des groupes",
height: '100%',
width: '100%',
editurl : 'manage_groups_controller.php?module=group'
});
jQuery("#frmac").jqGrid('navGrid','#pfrmac',{edit:false,add:true,del:false});
i have two somes problemes with inline edit on the rows Category and SubCategory:
1- when a categroy option selected the subcategory slectbox must be populated with option related to the category selectBox, the $.get function work fine , but i don't find how to put returned html to the Subcategory row.
2- on edit of the subcategory row i have to populate the select box with option related the the current category option , i can't find how to to pass the value to editoptions: {dataUrl:'manage_groups_controller.php?module=subcat&catid= ?????????'}

Jqgrid and Zend framework trouble

I have a list of products on my site. I draw it with jqGrid. Also I have a form, to create new product, or update existing one. Is there any way to set in jqGrid, that when I press 'edit' button in grid, it redirects me to page like
'mysite/product/edit/id/{id}'
Here is my grid script:
$(document).ready(function() {
$("#list").jqGrid({
url:'product/getjson',
datatype: "json",
colNames:['id','Name', 'description', 'Publication date','Picture'],
colModel:[
{name:'id',index:'id', width:55},
{name:'name',index:'name', width:90},
{name:'description',index:'description', width:200},
{name:'pubDate',index:'pubDate', width:200, align:"right"},
{name:'picPath',index:'picPath', width:200, align:"right"},
],
rowNum:10,
rowList:[10,20,30],
pager: '#pager2',
sortname: 'id',
viewrecords: true,
sortorder: "desc", caption: 'Products'});
$("#list").jqGrid('navGrid','#pager2',{edit:true,add:true,del:true});
})

You can change url with respect of onclickSubmit function (see http://www.trirand.com/jqgridwiki/doku.php?id=wiki:form_editing#editgridrow):
$("#list").jqGrid({
url:'product/getjson',
// ...
});
$("#list").jqGrid('navGrid','#pager2',{edit:true,add:true,del:true},
{ onclickSubmit: function(rp_ge, postdata) {
rp_ge.url = 'mysite/product/edit/id/' + postdata.list_id;
}
});

Try to add editurl field in your config:
$("#list").jqGrid({
editurl:'mysite/product/edit/'
});
id will be passed in row data