i am trying to create an editable grid with jqgrid - however I cant get the data to save to the database – I know its probably something really simple, but coding is not really my thing – just trying to help out a friend. Here is my latest html. I seem to be going round in circles when i google…
many thanks
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DT…..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>xxxxxx</title>
<link rel="stylesheet" type="text/css" href="timesheet_login.css">
<link rel="stylesheet" media="print" href="print.css" type="text/css">
<link rel="shortcut icon" href="oneline_logo.gif">
<link rel="stylesheet" type="text/css" media="screen" href="css/jquery-ui-1.8.16.custom.css" />
<link rel="stylesheet" type="text/css" media="screen" href="css/ui.jqgrid.css" />
<style type="text/css">
html, body {
margin: 0;
padding: 0;
font-size: 75%;
}
</style>
<script src="js/jquery-1.5.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 src="scripts/js/jqModal.js" type="text/javascript"></script>
<script src="scripts/js/jqDnR.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){
$("#rota").jqGrid({
url:'example.php',
datatype: "json",
mtype: 'POST',
colNames:['Date', 'HPJ', 'Recycler','CCTV','Assistant'],
colModel:[
{name:'date',index:'date', width:90,editable:true},
{name:'hpj',index:'hpj', width:100,editable:true},
{name:'recycler',index:'recycler', width:100,editable:true},
{name:'cctv',index:'cctv', width:100,editable:true},
{name:'assistant',index:'assistant', width:100,editable:true}
],
rowNum:10,
rowList:[10,20,30],
pager: '#pcelltbl',
sortname: 'date',
viewrecords: true,
sortorder: "desc",
caption:"Cell Edit Example",
forceFit : true,
cellEdit: true,
cellsubmit: 'clientArray',
editurl:'example.php?action=save'
});
jQuery("#rota").jqGrid('navGrid','#pgwidth',{edit:false,add:false,del:false});
});
</script>
</head>
<body>
<div id="topcontent">
<br><br>
</div><!– end topcontainer –>
<div id="centercontent">
<table id="rota"><tr><td/></tr></table>
<div id="pager"></div>
<script src="celledit.js" type="text/javascript"> </script>
</div>
<div id="footercontent">
</div><!– end footercontent –>
</body>
</html>
example.php:
<?php
$dbhost = xxxxx.com'; $dbuser = 'xxx'; $dbpassword = 'xxx'; $dbdatabase = xxxx;
$page = $_REQUEST['page']; // get the requested page
$limit = $_REQUEST['rows']; // get how many rows we want to have into the grid
$sidx = $_REQUEST['sidx']; // get index row - i.e. user click to sort
$sord = $_REQUEST['sord']; // get the direction
if(!$sidx) $sidx =1;
// connect to the database
$db = mysql_connect($dbhost, $dbuser, $dbpassword) or die("Connection Error: " . mysql_error());
mysql_select_db($dbdatabase) or die("Error conecting to db.");
$result = mysql_query("SELECT COUNT(*) AS count FROM rota");
$row = mysql_fetch_array($result,MYSQL_ASSOC);
$count = $row['count'];
if( $count >0 ) {
$total_pages = ceil($count/$limit);
} else {
$total_pages = 0;
}
if ($page > $total_pages) $page=$total_pages;
$start = $limit*$page - $limit; // do not put $limit*($page - 1)
if($start <0) $start = 0;
$SQL = "SELECT date, hpj, recycler, cctv, assistant FROM rota ORDER BY $sidx $sord LIMIT $start , $limit";
$result = mysql_query( $SQL ) or die("Couldn t execute query.".mysql_error());
$responce->page = $page;
$responce->total = $total_pages;
$responce->records = $count;
$i=0;
while($row = mysql_fetch_array($result,MYSQL_ASSOC)) {
$responce->rows[] = array('id'=>$row['date'], "cell"=>array($row['date'], $row['hpj'], $row['recycler'], $row['cctv'], $row['assistant']));
}
echo json_encode($responce);
?>
