Forum
12:53
28/05/2013
Good morning everybody,
I'm developing a project with a lot of jqgrid using jquery 1.10.0 , jquery ui 1.10.3 and jqgrid 4.5.2.
My problem is that, just for one grid (others work) I can't refresh json data.
This grid is refreshed when I select a row in another grid. The first time data are correctly loaded but the second time, data are loaded and the display 'loading' stays. Then if I try to refresh the grid another time, there isn't any http request sent.
Drag&drop and sort is also use in this grid.
As you can see in the code below, it's a little bit complicated because I first created the grid with local data ( just for have html DOM created and no request if data are not needed) and then I refresh data with datatype 'json' .
Code which create grid
paramEdit = {
optEdit:{
recreateForm:true,
beforeShowForm:function(){
$("#editmodtabCaracTech2 #tr_aliasName").show();
},
afterShowForm:function(){
$.getJSON('interfaceCallback.php?oper=getUsed&interface=app_Equipment_CT_PC&id='+$("#tabCaracTech2").getSelectedID()+'&propTypeID='+$("#editmodtabCaracTech2 #propTypeLabel").val(), function(data){
if(data.used == 1){
$("#editmodtabCaracTech2 #propTypeLabel").attr('disabled', true);
}else{
$("#editmodtabCaracTech2 #propTypeLabel").attr('disabled', false);
}
});
$("#editmodtabCaracTech2 #eval").click(function(){
if($(this).attr('checked')!=null)
$("#editmodtabCaracTech2 #tr_expression").show();
else
$("#editmodtabCaracTech2 #tr_expression").hide();
});
if($("#editmodtabCaracTech2 #eval").attr('checked')!=null)
$("#editmodtabCaracTech2 #tr_expression").show();
},
onAfterSubmit:function(response, postdata){
$.getJSON('interfaceCallback.php?oper=getProp&interface=app_Equipment_Tasks_Task&ap_equiptype_id='+$("#listEquipType").getSelectedID().substring(1), function(propCompteur){
$("#tabTask2").setColProp("prop",{
name:'prop',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propC
},
hidden:true
});
$("#tabTask2").setColProp("propDT",{
name:'propDT',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propDT
},
hidden:true
});
$("#tabTask2").setColProp("propL",{
name:'propL',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propL
},
hidden:true
});
});
if(response.responseText!='')
return eval(response.responseText);
if(postdata.propTypeLabel!=0){
createGrid($("div.task #listOnglet .current > a").attr('id')+'_Content');
return [true, ''];
}else
return [false, 'Format de propriété non valide.'];
}
},
optAdd:{
recreateForm:true,
reloadAfterSubmit:false,
beforeShowForm:function(){
$("#editmodtabCaracTech2 #tr_aliasName").show();
},
onAfterSubmit:function(response, postdata){
$.getJSON('interfaceCallback.php?oper=getProp&interface=app_Equipment_Tasks_Task&ap_equiptype_id='+$("#listEquipType").getSelectedID().substring(1), function(propCompteur){
$("#tabTask2").setColProp("prop",{
name:'prop',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propC
},
hidden:true
});
$("#tabTask2").setColProp("propDT",{
name:'propDT',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propDT
},
hidden:true
});
$("#tabTask2").setColProp("propL",{
name:'propL',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propL
},
hidden:true
});
});
if(postdata.propTypeLabel==0)
return [false, 'Format de propriété non valide.'];
else
return [true, ''];
},
afterShowForm:function(){
$("#editmodtabCaracTech2 #propTypeLabel").attr('disabled', false);
$("#editmodtabCaracTech2 #eval").click(function(){
if($(this).attr('checked')!=null)
$("#editmodtabCaracTech2 #tr_expression").show();
else
$("#editmodtabCaracTech2 #tr_expression").hide();
});
}
},
optDel:{
onAfterSubmit:function(response){
var result = eval(response.responseText);
if(result[0]){
$.getJSON('interfaceCallback.php?oper=getProp&interface=app_Equipment_Tasks_Task&ap_equiptype_id='+$("#listEquipType").getSelectedID().substring(1), function(propCompteur){
$("#tabTask2").setColProp("prop",{
name:'prop',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propC
},
hidden:true
});
$("#tabTask2").setColProp("propDT",{
name:'propDT',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propDT
},
hidden:true
});
$("#tabTask2").setColProp("propL",{
name:'propL',
width:20,
editable:true,
edittype:"select",
editoptions:{
value:propCompteur.propL
},
hidden:true
});
});
createGrid($("div.task #listOnglet .current > a").attr('id')+'_Content');
return [true, ''];
}else
return result;
}
}
};
$("#tabCaracTech2").jqGridIIT({
datatype : 'local',
fctEditParam:paramEdit,
fctSearch:false,
colNames:['Libellé', 'Format', 'Unité', 'Expr.', '', 'Alias'],
colModel:[ {
name:'label',
width:220,
editable:true,
sortable:false
},{
name:'propTypeLabel',
width:120,
editable:true,
edittype:"select",
editrules:{
required:true
},
sortable:false,
//editoptions:data
},{
name:'unit',
width:70,
editable:true,
sortable:false
},{
name:'eval',
width:40,
editable:true,
sortable:false,
align:"center",
formatter:"checkbox",
edittype:"checkbox",
editoptions: {
value:"2:0"
}
},{
name:'expression',
width:70,
editable:true,
sortable:false,
hidden:true
},{
name:'aliasName',
width:70,
editable:true,
hidden:true
}],
sortname: '',
caption:"",
rowNum:-1,
height:666,
initWidth:501,
toolbar: [true,"top"],
gridComplete:function(){
$("#tabCaracTech2").addFCT({
methode:'sortProp',
fct:function(){
if($("#t_tabCaracTech2").html()==''){
$("#t_tabCaracTech2").html('Mode : <input id="select" type="radio" name="mode" value="0" CHECKED><label for="select">Sélection</label><input id="tri" type="radio" name="mode" value="1"><label for="tri">Tri</label>');
$("#gbox_tabCaracTech2 input[name=mode]").click(function(){
if($(this).attr('value')=="1"){
$("#tabCaracTech2 tr").draggable({
disabled: true
});
$("#tabCaracTech2").sortableRows({
disabled: false
});
}else{
$("#tabCaracTech2 tr").draggable({
disabled: false
});
$("#tabCaracTech2").sortableRows({
disabled: true
});
}
});
}
if($("#gbox_tabCaracTech2 input[name=mode]:checked").val()!="0"){
$("#tabCaracTech2 tr").draggable({
disabled: true
});
$("#tabCaracTech2").sortableRows({
disabled: false
});
}else{
$("#tabCaracTech2 tr").draggable({
disabled: false
});
$("#tabCaracTech2").sortableRows({
disabled: true
});
}
}
});
},
selectRow:function(id){
if(id.split('_')[0]=='G'){
$("#gbox_tabCaracTech2 .ui-icon-pencil").parent().parent().hide();
$("#gbox_tabCaracTech2 .ui-icon-trash").parent().parent().hide();
}
if(id.split('_')[0]=='T')
$("#gbox_tabCaracTech2 .ui-icon-trash").parent().parent().hide();
}
});
$("#tabCaracTech2").addFCT({
methode:'sortProp',
fct:function(){
$("#tabCaracTech2").jqGrid('sortableRows',{
disabled: true,
stop:function(event, ui){
var order = $(this).sortable('toArray').toString();
$.get("interfaceCallback.php?oper=sortProp&interface=app_Equipment_CT_PC¶m=" + order);
$("#tabCaracTech2").jqGridAlterneClassRowIIT();
}
}).jqGrid('gridDnD',
{
connectWith: "#tabPropSelected2, #tabInfosEquip2",
droppos:"last",
dropbyname:true,
drag_opts:{
stop:null,
zIndex: 100,
revert:true,
helper:function(event){
if($("#dragger").length===0)
$('body').append('<div style="position : absolute ;" class="dragger ui-widget-header"></div>');
var lab;
if($(event.currentTarget).find('td:first').text().length>50)
lab = $(event.currentTarget).find('td:first').text().substr(0, 50) + ' …';
else
lab = $(event.currentTarget).find('td:first').text();
$(".dragger").text(lab);
$(".dragger").attr('id', $(event.currentTarget).attr('id').split('_')[0]=='G' || $(event.currentTarget).attr('id').split('_')[0]=='T'?$(event.currentTarget).attr('id').split('_')[1]:$(event.currentTarget).attr('id'));
return $(".dragger");
},
cursorAt:{
bottom:0,
left:20
}
},
ondrop:function(event, ui){
dropPropEquipment($(this), ui);
}
});
}
});
Code which refresh grid:
datatype : 'json',
parameter:'&ap_equiptype_id='+$("#listEquipType").getSelectedID().substring(1),
page:1,
editurl : callback + "?interface=" + inter + "&ap_equiptype_id=" +$("#listEquipType").getSelectedID().substring(1)
});
Code for the function jqGridRefreshIIT
var settings = $.extend({
inter: $(this).getGridParam('inter'),
parameter: $(this).getGridParam('parameter'),
callback: $(this).getGridParam('callback'),
url: (opt.callback != null ? opt.callback : $(this).getGridParam('callback')) + '?oper=load&interface=' + (opt.inter != null ? opt.inter : $(this).getGridParam('inter')) + (opt.parameter != null ? opt.parameter : $(this).getGridParam('parameter'))
}, opt)
$(this).setGridParam(settings).jqGridSetCaptionIIT();
if ($(this).getGridParam('fctPrint')) {
$(this).jqGridSetFileNameIIT();
}
if ($(this).getGridParam('fctExport')) {
$(this).jqGridSetFileNameIIT();
$(this).jqGridExportIIT({});
}
if ($(this).getGridParam('fctPDF')) {
$(this).jqGridSetFileNameIIT();
}
$(this).trigger('reloadGrid');
return $(this);
}
As you can see, parameter callback and inter are use to create the url .
Thanks, oeil_de_nuit59
ps : sorry for my english, I'm a french teenager.
EDIT : after some search, I've found that the problem doesn't come from the refresh but from the resize of the grid. In fact, after a resize, I can't refresh my grid. If I try to refresh it, the grid stay with the display 'loading'
In order to resize my grid with the parent's size, I use this function:
selected = this;
if (this.parent().parent().parent().parent().parent().children('div[id*=period]').length !== 0)
externe = 27;
else
externe = 0;
selected.setGridWidth(selected.parent().parent().parent().parent().parent().width() – 2); // on lui met la taille de son parent en largeur
// on récupère la différence de taille entre son parent et sa taille actuelle
height = selected.parent().parent().parent().parent().outerHeight() – selected.parent().parent().height();
// on lui met la taille de son parent moins la difference
selected.setGridHeight(selected.parent().parent().parent().parent().parent().height() – (height + externe));
};
And I used it with thoses lines :
Is there any mistake in my code ?
Most Users Ever Online: 715
Currently Online:
50 Guest(s)
Currently Browsing this Page:
1 Guest(s)
Top Posters:
OlegK: 1255
markw65: 179
kobruleht: 144
phicarre: 132
YamilBracho: 124
Renso: 118
Member Stats:
Guest Posters: 447
Members: 11373
Moderators: 2
Admins: 1
Forum Stats:
Groups: 1
Forums: 8
Topics: 10592
Posts: 31289
Newest Members:
, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.comModerators: tony: 7721, Rumen[Trirand]: 81
Administrators: admin: 66