Forum


04:17

Hi, i'm experiencing problems with FireFox and JQGrid, on IE8 my grid works very good. The problems is this: when the cliente edit something (add, delete or edit a row) the JQgrid is "Loading..." about 7-8 seconds, and on IE do in miliseconds, it's strange, my server side script language is Python, and the data is JSON. Here is my .html code:
<link rel="stylesheet" type="text/css" media="screen" href="css/redmond/jquery-ui-1.7.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#list_alas").jqGrid({
url:'jqgrid.cgi?t=0',
datatype: 'json',
width: 1200,
imgpath: 'css/redmond/images',
colNames:['Name','IP'],
colModel :[
{name:'Name', index: 'Name', width:250, align: 'center', resizable: false, editable: true, sortable: false},
{name:'IP', index: 'IP',width: 250, align: 'center',resizable: false, editable: true, sortable: false},
],
jsonReader :{
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: true,
cell: "cell",
id: "id",
},
savekey: true,
pager: jQuery('#pager_alas'),
rowNum:10,
rowList:[10, 20, 30],
sortname: 'Name',
sortorder: 'desc',
viewrecords: true,
editurl: 'jqgrid_edit_alas.cgi',
caption: 'SISP-Alas Configurator',
}).navGrid("#pager_alas",{view:false, search:false, refresh:false},
{recreateForm: true, closeAfterEdit: true, reloadAfterSubmit:false, savekey: [true, 13]},
{recreateForm: true, closeAfterAdd: true, reloadAfterSubmit:false, savekey: [true, 13]},
{recreateForm: true, clseAfterDel: true, reloadAfterSubmit:false, savekey: [true, 13]}
);
//more grids that are irrelevant to the problem (have the same configuration than the #list_alas" grid.
});
</script>
</head>
<body>
<table id="list_alas"></table>
<div id="pager_alas"></div>
<table id="list_po"></table>
<div id="pager_po"></div>
<table id="list_cells"></table>
<div id="pager_cells"></div>
</body>
</html>
All help is welcome, and sorry for my bad english 🙂 I think the problem is this code :S but i'm not sure. I can post my python script if is needed.
04:04

Moderators
30/10/2007

Hello,
If this is the original code I wonder how this work in FF and especially in IE. You have a not needed comma here:
colModel :[
{name:'Name', index: 'Name', width:250, align: 'center', resizable: false, editable: true, sortable: false},
{name:'IP', index:'IP',width:250, align:'center',resizable:false,editable:true,sortable: false}, <- Erorr
],
Best Regards
Tony
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
05:49

Thanks for your answer, Tony!
Oh, what a fail.. :$ First time programming on JS, so sorry… But, the problem is the same, my full code is that:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>ALAS</title>
<link rel="stylesheet" type="text/css" media="screen" href="css/redmond/jquery-ui-1.7.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#list_alas").jqGrid({
url:'jqgrid.cgi?t=0',
datatype: 'json',
width: 1200,
imgpath: 'css/redmond/images',
colNames:['Name', 'IP'],
colModel :[
{name:'Name', index: 'Name', width:250, align: 'center', resizable: false, editable: true, sortable: false},
{name:'IP', index: 'IP', width: 250, align: 'center', resizable: false, editable: true, sortable: false}
],
jsonReader :{
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: true,
cell: "cell",
id: "id"
},
savekey: true,
pager: jQuery('#pager_alas'),
rowNum:10,
rowList:[10, 20, 30],
viewrecords: true,
editurl: 'jqgrid_edit_alas.cgi',
caption: 'SISP-Alas Configurator'
}).navGrid("#pager_alas",{view:false, search:false, refresh:false},
{recreateForm: true, closeAfterEdit: true, reloadAfterSubmit: false, savekey: [true, 13]},
{recreateForm: true, closeAfterAdd: true, reloadAfterSubmit: false, savekey: [true, 13]},
{recreateForm: true, closeAfterDel: true, reloadAfterSubmit: false, savekey: [true, 13]}
);
jQuery("#list_po").jqGrid({
url:'jqgrid.cgi?t=1',
datatype: 'json',
width: 1200,
imgpath: 'css/redmond/images',
colNames:['Name', 'ID', 'IP', 'Ala', 'Associated OP', 'Sequence'],
colModel :[
{name:'Name', index:'Name', width:83, align: 'center', resizable: false, editable: true, sortable: false},
{name:'ID', index: 'ID', width: 83, align: 'center', resizable: false, editable: true, sortable: false},
{name:'IP', index: 'IP', width: 83, align: 'center', resizable: false, editable: true, sortable: false},
{name:'Ala', index: 'Ala', width: 83, align: 'center', resizable: false, editable: true, sortable: false, edittype: "select", editoptions: {dataUrl: 'jqgrid_select.cgi?t=0'}},
{name:'Associated OP', index: 'PO Asociado', width: 83, align: 'center', resizable: false, editable: true, sortable: false},
{name:'Sequence', index: 'Sequence', width: 83, align: 'center', resizable: false, editable: true, sortable: false}
],
jsonReader :{
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: true,
cell: "cell",
id: "id"
},
pager: jQuery('#pager_po'),
rowNum:10,
rowList:[10, 20, 30],
viewrecords: true,
editurl: 'jqgrid_edit_po.cgi',
caption: 'SISP-OP Configurator'
}).navGrid("#pager_po",{view:false, search:false, refresh:false},
{recreateForm: true, closeAfterEdit: true, reloadAfterSubmit: false, savekey: [true, 13]},
{recreateForm: true, closeAfterAdd: true, reloadAfterSubmit: false, savekey: [true, 13]},
{recreateForm: true, colseAfterDel: true, reloadAfterSubmit: false, savekey: [true, 13]}
);
jQuery("#list_cells").jqGrid({
url:'jqgrid.cgi?t=2',
datatype: 'json',
width: 1200,
imgpath: 'css/redmond/images',
colNames:['Name','ID', 'Ala', 'OP', 'IN-0', 'IN-1', 'IN-2', 'IN-3', 'OUT-0', 'OUT-0 (IS)', 'OUT-1', 'OT-1 (IS)', 'OUT-2', 'OUT-2 (IS)', 'OUT-3', 'OUT-3 (IS)'],
colModel :[
{name:'Name', index:'Name', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'ID', index: 'ID', width: 50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'Ala', index: 'Ala', width: 50, align: 'center', resizable: false, editable: true, sortable: false, edittype: "select", editoptions: {dataUrl: 'jqgrid_select.cgi?t=0'}},
{name:'OP', index: 'OP', width: 50, align: 'center', resizable: false, editable: true, sortable: false, edittype: "select", editoptions: {dataUrl: 'jqgrid_select.cgi?t=1'}},
{name:'IN-0', index:'IN-0', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'IN-1', index:'IN-1', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'IN-2', index:'IN-2', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'IN-3', index:'IN-3', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'OUT-0', index:'OUT-0', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'OUT-0 (IS)', index:'OUT-0 (IS)', width:50, align: 'center', resizable: false, editable: true, sortable: false, edittype: "select", editoptions: {value:{0:'On',1:'Off'}}},
{name:'OUT-1', index:'OUT-1', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'OUT-1 (IS)', index:'OUT-1 (IS)', width:50, align: 'center', resizable: false, editable: true, sortable: false, edittype: "select", editoptions: {value:{0:'On',1:'Off'}}},
{name:'OUT-2', index:'OUT-2', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'OUT-2 (IS)', index:'OUT-2 (IS)', width:50, align: 'center', resizable: false, editable: true, sortable: false, edittype: "select", editoptions: {value:{0:'On',1:'Off'}}},
{name:'OUT-3', index:'OUT-3', width:50, align: 'center', resizable: false, editable: true, sortable: false},
{name:'OUT-3 (IS)', index:'OUT-3 (IS)', width:50, align: 'center', resizable: false, editable: true, sortable: false, edittype: "select", editoptions: {value:{0:'On',1:'Off'}}}
],
jsonReader :{
root: "rows",
page: "page",
total: "total",
records: "records",
repeatitems: true,
cell: "cell",
id: "id"
},
pager: jQuery('#pager_cells'),
rowNum:10,
rowList:[10, 20, 30],
viewrecords: true,
editurl: 'jqgrid_edit_cells.cgi',
caption: 'SISP-Cells configuration'
}).navGrid("#pager_cells",{view:false, search:false, refresh: false},
{recreateForm: true, closeAfterEdit: true, reloadAfterSubmit: false, savekey: [true, 13]},
{recreateForm: true, closeAfterAdd: true, reloadAfterSubmit: false, savekey: [true, 13]},
{recreateForm: true, closeAfterDel: true, reloadAfterSubmit: false, savekey: [true, 13]}
);
});
</script>
</head>
<body>
<table id="list_alas"></table>
<div id="pager_alas"></div>
<table id="list_po"></table>
<div id="pager_po"></div>
<table id="list_cells"></table>
<div id="pager_cells"></div>
</body>
</html>
i think all the commas are in good position now :p, thanks for your time and hep Tony
04:02

22/10/2009

I tried to debug the JQgrid with firebug, on Script i set to true the stop if the script has an error option.
When click on navigator Edit button, fireug show me that:
j.p.colModel[h].formoptions is undefined on function htmlDecode().
On Del button:
d(":input:visible", f.w[0] is undefined
On Add button:
seems to give me the same error than Edit button.
Im not using the formoptions, and i check the colModel values and i didn't see any value wrong, help are welcome 🙂
03:13

Moderators
30/10/2007

Hello,
I think you do not have downloaded all the needed modules when you build the download or be a sure that all the javascript files are loaded correct.
Regards
Tony
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
05:19

22/10/2009

Hi Tony, i redownload the JQgrid with all options marked (3.5.3) and i uploadthem to server, run the web, and the editselect type cells show "undefined" ,edit not work firebug gives me this error:
05:22

Moderators
30/10/2007

Hello,
Be a sure that you load the language file grid.locale-en.js before the jquery.jqGrid.min.js
Regards
Tony
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
05:29

22/10/2009

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>ALAS</title>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<link rel="stylesheet" type="text/css" media="screen" href="css/redmond/jquery-ui-1.7.2.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<script src="js/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/i18n/grid.locale-en.js" type="text/javascript"></script>
<script src="js/jquery.jqGrid.min.js" type="text/javascript"></script>
This is my html, grid.locale-en.js is loaded first than jqGrid :S, on server all files are on 777 permision so, don't know what is the problem. :S
06:03

Moderators
30/10/2007

Hello,
Do not know - sorry. The last chance - could you please replace
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
06:10

22/10/2009

No, still don't work with <html>, but i redownload the JQgrid plugin without the option “Formatter” and works like before, so the undefined option is when i put this option on jqgrid file. jqgrid still don't work well on firefox Now i have 3.5.3 without formatter option on the server, and on IE works pretty good.
EDIT: I have delete on some cells the variable Formatter: 'select', and don't give me undefined errors, but still don't work :S, so the undefined error was my problem :$
In conclusion, last version of JQgrid with all options and still don't work :S could be some theme options?
03:20

Moderators
30/10/2007

Hello,
Could you please try first just with one grid and see the result, then add the second and etc.
Regards
Tony
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
08:05

Moderators
30/10/2007

Hello,
Do you have all correct on the server. In FireBug see how long is the request to the server.
Tony
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
13:56

Moderators
30/10/2007

Felix,
In order to finish this saga, could you please send me a link to the problem?
Best Regards
Tony
For professional UI suites for Java Script and PHP visit us at our commercial products site - guriddo.net - by the very same guys that created jqGrid.
Most Users Ever Online: 715
Currently Online:
77 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