Forum
Log In
Home
Topic RSS
18:53
17/12/2008
Offline
Hello,
I want to set up form editing. I tried to use a button "Edit Selected" as the demo. But the button is not functional.
the html code for the button:
<input type="BUTTON" id="bedata" value="Edit Selected" />
the javascript :
$("#bedata").click(function(){
var gr = jQuery("#editgrid").getGridParam('selrow');
if( gr != null ) jQuery("#editgrid").editGridRow(gr,{height:280,reloadAfterSubmit:false});
else alert("Please Select Row");
});
Any ideas? Thanks!
Maggie
20:50
22/12/2008
Offline
What's your html code for jqGrid? add alert(gr); after the gr = jQuery(”#editgrid”).getGridParam('selrow'); to see if you get the selected row ID, also use jut ' instead of " everywhere sometimes it matters. your code should work. I am using exactly the same way from a button in my pager
08:56
17/12/2008
Offline
I added the alert message but nothing happened when I click on the button. Here are my html codes:
<html>
<head>
<title>jqGrid Demo</title>
<link rel="stylesheet" type="text/css" media="screen"
href="jquery/themes/basic/grid.css" />
<link rel="stylesheet" type="text/css" media="screen"
href="jquery/themes/jqModal.css" />
<script src="jquery/jquery.js" type="text/javascript"></script>
<script src="jquery/jquery.jqGrid.js" type="text/javascript"></script>
<script src="jquery/js/jqModal.js" type="text/javascript"></script>
<script src="jquery/js/jqDnR.js" type="text/javascript"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery("#editgrid").jqGrid({
url:'http://localhost:8080/ReportsP.....d',
datatype: 'xml',
mtype: 'GET',
colNames:['Inv No','Date', 'Amount','Tax','Total','Notes'],
colModel :[
{name:'invid', index:'invid', width:60, editable:false,editoptions:{readonly:true,size:10}},
{name:'invdate', index:'invdate', width:90, editable:true,editoptions:{size:25}},
{name:'amount', index:'amount', width:80, align:'right', editable:true,editoptions:{size:25}},
{name:'tax', index:'tax', width:80, align:'right', editable:true,editoptions:{size:25}},
{name:'total', index:'total', width:80, align:'right', editable:true,editoptions:{size:25}},
{name:'note', index:'note', width:150, sortable:false, editable: true,edittype:"textarea", editoptions:{rows:"2",cols:"20"}} ],
pager: jQuery('#pager'),
rowNum:10,
rowList:[10,20,30],
sortname: 'invid',
sortorder: "desc",
viewrecords: true,
imgpath: 'jquery/themes/basic/images',
caption: 'My first grid',
editurl:"someurl.jsp"
});
});
$("#bedata").click(function(){
var gr = jQuery("#editgrid").getGridParam('selrow');
alert ("rowid" + gr);
//if( gr != null ) jQuery("#editgrid").editGridRow(gr, {height:280,reloadAfterSubmit:false});
//else alert("Please Select Row");
alert ("test!");
});
</script>
</head>
<body>
<table id="editgrid" class="scroll" cellpadding="0" cellspacing="0"></></table>
<div id="pager" class="scroll" style="text-align: center;"></div>
<input type="BUTTON" id="bedata" value="Edit Selected" />
</body>
</html>
Do I miss including some javascripts?
Thanks! Maggie
10:57
22/12/2008
Offline
I did not go through your entire code, but it looks like your $(”#bedata”).click code is outsite of jQuery(document).ready(function(){ });
it should be inside of ready, or apply <input type=”BUTTON” id=”bedata” value=”Edit Selected” onclick='yourfunction();' /> then define yourfunction to call editGridRow. Just move }); before $('#bedata').click at the end of your script.
!
Most Users Ever Online: 715
Currently Online:
46 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
