Forum
Log In
Home
Topic RSS
11:35
12/11/2010
Offline
I am trying to do cell editing using jquery.jqGrid-3.8.1.
CODE:
<!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>My First Grid</title>
<link rel="stylesheet" href="css/ui.jqgrid.css" type="text/css" />
<link rel="stylesheet"
href="css/ui-lightness/jquery-ui-1.8.6.custom.css" type="text/css" />
<style>
html, body {
margin: 0;
padding: 0;
font-size: 75%;
}
</style>
<script src="js/jquery-1.4.2.min.js"></script>
<script src="js/i18n/grid.locale-en.js"></script>
<script src="js/grid.formedit.js"></script>
<script src="js/grid.inlinedit.js"></script>
<script src="js/jquery.jqGrid.min.js"></script>
<script src="js/grid.celledit.js"></script>
<script type="text/javascript">
$(document).ready(function(){
var lastsel2;
$("#list").jqGrid({
url:'Grid',
datatype: 'xml',
mtype: 'GET',
colNames:['APP_ID','CODE', 'VALUE'],
colModel :[
{name:'APP_ID', index:'APP_ID', width:100, editable:true, edittype:"text", editoptions:{size:10, maxlength: 15}},
{name:'CODE', index:'CODE', width:100, editable:true, edittype:"text", editoptions:{size:10, maxlength: 15}},
{name:'VALUE', index:'VALUE', width:500, align:'right', editable:true, edittype:"text", editoptions:{size:10, maxlength: 15}}],
pager: $('#pager'),
rowNum:10,
rowList:[10,20,30],
sortname: 'id',
sortorder: "desc",
viewrecords: true,
imgpath: 'themes/basic/images',
caption: 'My first grid'
});
$("#bedata").click(function(){
var gr = $("#list").jqGrid('getGridParam','selrow');
if( gr != null ) $("#list").jqGrid('editGridRow',gr,{height:280,reloadAfterSubmit:false});
else alert("Please Select Row");
});
});
</script>
</head>
<body>
<table id="list" class="scroll"></table>
<div id="pager" class="scroll" style="text-align:center;"></div>
<input type="BUTTON" id="bedata" value="Edit Selected"/>
</body>
</html>
Whenever I try to edit any row it gives an error No such method: editGridRow. Is there any js file missing? What is wrong with this code? Also whenever I want to select any row it only selects first row.
Regards,
Amruta
12:59
10/08/2009
Offline
Hallo Amruta,
you should deceide whether to use minimized version of jqGrid jquery.jqGrid.min.js downloaded so that it contain all modules which you need of use uncompressed developer version (see documentation). If you include grid.formedit.js or grid.inlinedit.js
you have to include dependend module grid.base.js and grid.common.js before.
Regards
Oleg
08:04
12/11/2010
Offline
Hello Oleg,
Thank you for that. It worked. The row can be edited, but the row is not being saved. What to add more?
Regards,
Amruta
11:23
10/08/2009
Offline
Hello,
You try to use form editing without setting editurl parameter of jqGrid. Is the url:'Grid' response also for HTTP POST requests to save the data during the editing?
Best regards
Oleg
11:32
12/11/2010
Offline
Hello Oleg,
Yes it is POST only. 'Grid' is a servlet. But in jQuery, how the servlet request will be sent? Can you give some example? Here is a
code:
<script type="text/javascript">
$(document).ready(function(){
var lastsel2;
$("#list").jqGrid({
url:'Grid',
datatype: 'xml',
mtype: 'GET',
colNames:['APP_ID','CODE', 'VALUE'],
colModel :[
{name:'APP_ID', index:'APP_ID', width:100, editable:true},
{name:'CODE', index:'CODE', width:100, editable:true},
{name:'VALUE', index:'VALUE', width:500, align:'right', editable:true}],
pager: $('#pager'),
rowNum:10,
rowList:[10,20,30],
sortname: 'id',
sortorder: "desc",
viewrecords: true,
imgpath: 'themes/basic/images',
caption: 'My first grid',
cellEdit: true,
cellsubmit: 'clientArray',
afterEditCell : function(rowid,name,val,iRow,iCol) {
jQuery("#list").jqGrid('setCell',iRow,name,val);
},
afterSaveCell : function(rowid,name,val,iRow,iCol) {
if(name == 'APP_ID') {
var appIdval = jQuery("#list").jqGrid('getCell',iRow,iCol);
jQuery("#list").jqGrid('setRowData',iRow,appIdval);
}
if(name == 'CODE') {
var codeval = jQuery("#list").jqGrid('getCell',iRow,iCol);
jQuery("#list").jqGrid('setRowData',iRow,codeval);
}
if(name == 'VALUE') {
var val = jQuery("#list").jqGrid('getCell',iRow,iCol);
jQuery("#list").jqGrid('setRowData',iRow,val);
}
}
});
});
</script>
Regards,
Amruta
Most Users Ever Online: 715
Currently Online:
66 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
