Forum
Log In
Home
Topic RSS
21:22
10/11/2009
Offline
This is my first time using jqgrid and the "my First Grid example worked perfectly for me."
When I try any of the examples in the wiki or specifically the editable grids I get a completely blank screen.
Can anyone tell me what I'm doing wrong?
<!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" 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" />
<style>
html, body {
margin: 0;
padding: 0;
font-size: 75%;
}
</style>
<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("#rowed1").jqGrid({
url:'naftaData.php?q=2',
datatype: "json",
colNames:['Inv No','Date', 'Client', 'Amount'],
colModel:[
{name:'id',index:'id', width:55},
{name:'invdate',index:'invdate', width:90, editable:true},
{name:'name',index:'name', width:100,editable:true},
{name:'amount',index:'amount', width:80, align:"right",editable:true}
],
rowNum:10,
rowList:[10,20,30],
imgpath: gridimgpath,
pager: jQuery('#prowed1'),
sortname: 'id',
viewrecords: true,
sortorder: "desc",
editurl: "server.php",
caption: "Basic Example"
}).navGrid("#prowed1",{edit:false,add:false,del:false});
jQuery("#ed1").click( function() {
jQuery("#rowed1").editRow("13");
this.disabled = 'true';
jQuery("#sved1,#cned1").attr("disabled",false);
});
jQuery("#sved1").click( function() {
jQuery("#rowed1").saveRow("13");
jQuery("#sved1,#cned1").attr("disabled",true);
jQuery("#ed1").attr("disabled",false);
});
jQuery("#cned1").click( function() {
jQuery("#rowed1").restoreRow("13");
jQuery("#sved1,#cned1").attr("disabled",true);
jQuery("#ed1").attr("disabled",false);
});
});
</script>
</head>
<body>
<table id="rowed1" class="scroll" cellpadding="0" cellspacing="0"></table>
<div id="prowed1" class="scroll" style="text-align:center;"></div>
<br />
<input type="BUTTON" id="ed1" value="Edit row 13" />
<input type="BUTTON" id="sved1" disabled='true' value="Save row 13" />
<input type="BUTTON" id="cned1" disabled='true' value="Cancel Save" />
</body>
</html>
04:01
Moderators
30/10/2007
Offline
Hello,
Welcome to jqGrid community.
I think if you have a working grid initiallly, you should add the functionalities to this grid rather than to copy paste the exmples, or look into the example and apply the new things to the working grid.
I think this is more natural way to learn jqGrid rather than to copy paste code without to understand them.
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:
56 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
