jqgrid demo
本人是用php写的,相信只要稍微用点时间看本人写的,就一定能看懂
前台代码
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1-strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<title>my frist jqgrid</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<link href="jqGrid/jquery-ui-1.10.1.custom.min.css" rel="stylesheet" type="text/css" /><!--外部链接CSS-->
<link rel="stylesheet" type="text/css" href="jqGrid/ui.jqgrid.css">
<script type="text/javascript" src="jqGrid/jquery-1.7.2.min.js"></script>
<script type="text/javascript" src="jqGrid/jquery-ui-1.10.1.custom.min.js"></script>
<script type="text/javascript" src="jqGrid/grid.locale-cn.js"></script>
<script type="text/javascript" src="jqGrid/jquery.jqGrid.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
jQuery('#list').jqGrid({
url:'example.php',
datatype:'xml',
mtype:'GET',
colNames:['invid','invdate','amount','Tax','Total','note'],
colModel:[
{name:'invid',index:'invid',width:55,editable:true},
{name:'invdate',index:'invdate',width:90,editable:true},
{name:'amount',index:'amount',width:80,editable:true},
{name:'Tax',index:'Tax',width:80,editable:true},
{name:'Total',index:'Total',width:80,editable:true},
{name:'note',index:'note',width:90,editable:true}],
pager:'#pager',
rowNum:10,
width:'auto',
editurl: "add.php",
autoheight:true,
height:'auto',
rowList:[10,20,30],
sortname:'invid',
viewrecords:true,
caption:'my frist grid'
});
var add_options={
width:320,
height:300,
left:250,
top:40,
jqModal:true,
reloadAfterSubmit:true,
addCaption: "添加新记录",
bSubmit: "保存",
bCancel: "关闭",
closeAfterAdd:true,
afterSubmit: function(response,postdata){
var msg = response.responseText;
msg = "<xml>"+msg+"</xml>";
var result = jQuery(msg).find("status").text();
if(result == "success")
return [true,"添加成功!",""];
else
return [false,"添加失败!",""];
},
afterShowForm:function(formid){
// var date = new Date();
// jQuery('#cdate').val(date.toLocaleDateString());
},
};
var edit_options={
width:320,
height:'auto',
left:250,
top:40,
reloadAfterSubmit:true,
jqModal:true,
addCaption: "编辑该项目信息",
bSubmit: "保存",
bCancel: "关闭",
closeAfterEdit:true,
afterSubmit:function(response,postdata){
//alter(response.responseText);
var msg = response.responseText;
//msg = "<xml>"+msg+"</xml>";
var result = jQuery(msg).find("status").text();
if(result == "success"){
return [true,"修改成功!",""];
}
else
return [false,"修改失败!",""];
},
};
var search_option = {
width:620,
height:150
};
jQuery("#list").jqGrid(
'navGrid','#pager',
{
edit:true,edittext:"修改",add:true,addtext:"增加",
del:true,deltext:"删除",refresh:true,refreshtext:"刷新"
},edit_options,add_options,{},search_option,{}
);
});
</script>
<style type="text/css">
</style>
</head>
<body>
<table id="list"></table>
<div id="pager"></div>
</body>
</html>
后台显示和修改代码
<?php
/*include("db.php");*/
$page=$_GET['page'];//获取表格page值,默认1
$limit=$_GET['rows'];//获得表格中rowNum值,表示需要多少行
$sidx=$_GET['sidx'];//获得默认排序值
$sord=$_GET['sord'];//获得排序方式,初始值为sort or der值
$search=$_REQUEST['_search'];
if(!$sidx)$sidx=1;
$db=mysql_connect('localhost','lj','1111')or die("连接问题:".mysql_error());
mysql_select_db('lj')or die("无法连接上库");
$result = mysql_query("SELECT COUNT(*) AS count FROM invheader a");
$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;
if($search=='false'){
$SQL = "SELECT a.invid, a.invdate, a.amount,a.tax,a.total,a.note FROM invheader a WHERE "
." a.invid ORDER BY $sidx $sord LIMIT $start,$limit";
}
else{
$searchString=$_REQUEST['searchString'];
$SQL = "SELECT a.invid, a.invdate, a.amount,a.tax,a.total,a.note FROM invheader a WHERE "
." a.invid=".$searchString." ORDER BY $sidx $sord LIMIT $start,$limit";
}
/*var_dump($SQL);die;*/
$result = mysql_query( $SQL ) or die("Couldnt execute query.".mysql_error());
if ( stristr($_SERVER["HTTP_ACCEPT"],"application/xhtml+xml") ) {
header("Content-type: application/xhtml+xml;charset=utf-8"); } else {
header("Content-type: text/xml;charset=utf-8");
}
$et = ">";
echo "<?xml version='1.0' encoding='utf-8'?$et\n";
echo "<rows>";
echo "<page>".$page."</page>";
echo "<total>".$total_pages."</total>";
echo "<records>".$count."</records>";
// be sure to put text data in CDATA
while($row = mysql_fetch_array($result,MYSQL_ASSOC)) {
echo "<row id='".$row['invid']."' >";
echo "<cell>". $row['invid']."</cell>";
echo "<cell>". $row['invdate']."</cell>";
echo "<cell>". $row['amount']."</cell>";
echo "<cell>". $row['tax']."</cell>";
echo "<cell>". $row['total']."</cell>";
echo "<cell><![CDATA[". $row['note']."]]></cell>";
echo "</row>";
}
echo "</rows>";
?>
后台添加代码
<?php
$oper=$_POST['oper'];
switch ($oper) {
case 'add':
$invid=$_REQUEST['invid'];
$invdate=$_REQUEST['invdate'];
$amount=$_REQUEST['amount'];
$tax=$_REQUEST['Tax'];
$total=$_REQUEST['Total'];
$note=$_REQUEST['note'];
$sql=<<<EOF
INSERT INTO invheader(invid,invdate,amount,tax,total,note)
VALUES($invid,'$invdate',$amount,$tax,$total,$note);
EOF;
$db=mysql_connect('localhost','lj','1111')or die("连接问题:".mysql_error());
mysql_select_db('lj')or die("无法连接上库");
$result = mysql_query( $sql ) or die("Couldnt execute query.".mysql_error());
//$command=Yii::app()->db->createCommand($sql);
if($result>=0 ){
echo "<xml><status>success</status></xml>";
}else{
echo "<xml><status>error</status></xml>";
}
break;
case 'edit':
$invid=$_REQUEST['invid'];
$invdate=$_REQUEST['invdate'];
$amount=$_REQUEST['amount'];
$tax=$_REQUEST['Tax'];
$total=$_REQUEST['Total'];
$note=$_REQUEST['note'];
$sql=<<<EOF
update invheader set invid=$invid,invdate=$invdate,
amount=$amount,tax=$tax,total=$total,note=$note
where invid=$invid
;
EOF;
var_dump($sql);
$db=mysql_connect('localhost','lj','1111')or die("连接问题:".mysql_error());
mysql_select_db('lj')or die("无法连接上库");
$result = mysql_query( $sql ) or die("Couldnt execute query.".mysql_error());
//$command=Yii::app()->db->createCommand($sql);
if($result>=0 ){
echo "<xml><status>success</status></xml>";
}else{
echo "<xml><status>error</status></xml>";
}
break;
case 'del':
$invid=$_REQUEST['id'];
$sql=<<<EOF
delete from invheader where invid=$invid
EOF;
var_dump($sql);
$db=mysql_connect('localhost','lj','1111')or die("连接问题:".mysql_error());
mysql_select_db('lj')or die("无法连接上库");
$result = mysql_query( $sql ) or die("Couldnt execute query.".mysql_error());
//$command=Yii::app()->db->createCommand($sql);
if($result>=0 ){
echo "<xml><status>success</status></xml>";
}else{
echo "<xml><status>error</status></xml>";
}
break;
default:
# code...
break;
}
?>
jqgrid demo的更多相关文章
- Web jquery表格组件 JQGrid 的使用 - 从入门到精通 开篇及索引
因为内容比较多,所以每篇讲解一些内容,最后会放出全部代码,可以参考.操作中总会遇到各式各样的问题,个人对部分问题的研究在最后一篇 问题研究 里.欢迎大家探讨学习. 代码都经过个人测试,但仍可能有各种未 ...
- jQuery插件:jqGrid引入及基本属性
1. jqGrid下载 jqGrid下载地址: http://www.trirand.com/blog/ jqGrid Demo: http://www.guriddo.net/demo/guridd ...
- Jqgrid学习API
JQGrid是一个在jquery基础上做的一个表格控件,以ajax的方式和服务器端通信. JQGrid Demo 是一个在线的演示项目.在这里,可以知道jqgrid可以做什么事情. 下面是转自其他人b ...
- 【转】jqGrid 各种参数 详解
[原文]http://www.cnblogs.com/younggun/archive/2012/08/27/2657922.htmljqGrid 各种参数 详解 JQGrid JQGrid是一个 ...
- JQGrid 参数、属性API
JQGrid是一个在jquery基础上做的一个表格控件,以ajax的方式和服务器端通信. JQGrid Demo 是一个在线的演示项目.在这里,可以知道jqgrid可以做什么事情. 下面是转自其他人b ...
- jqGrid 各种参数 详解
JQGrid JQGrid是一个在jquery基础上做的一个表格控件,以ajax的方式和服务器端通信. JQGrid Demo 是一个在线的演示项目.在这里,可以知道jqgrid可以做什么事情. 下面 ...
- JqGrid 使用方法详解
JQGrid JQGrid是一个在jquery基础上做的一个表格控件,以ajax的方式和服务器端通信. JQGrid Demo 是一个在线的演示项目.在这里,可以知道jqgrid可以做什么事情. 下面 ...
- jqGrid API 全
JQGrid是一个在jquery基础上做的一个表格控件,以ajax的方式和服务器端通信. JQGrid Demo 是一个在线的演示项目.在这里,可以知道jqgrid可以做什么事情. 下面是转自其他人b ...
- jqGrid笔记@简单实现
jqGrid在MVC中的版本是已经通过 HtmlHelper 的扩展方法封装后的产物,webForm版本貌似也将其封装成了服务器端空间,所以我推荐下载原生的jqGrid版本的地址为:http://ww ...
随机推荐
- Python 创建特殊元组tuple
创建1个元素的tuple (1,) 创建单元素tupletuple和list一样,可以包含 0 个.1个和任意多个元素.包含多个元素的 tuple,前面我们已经创建过了.包含 0 个元素的 tupl ...
- ReadOnly field saved with NULL value
On CRM opportunity form view, i added readonly="1" for probability field. When i saved, wh ...
- Inno Setup Pascal Script to search for running process
I am currently trying to do a validation at the uninstall moment. In a Pascal script function, in In ...
- JS 校验,检测,验证,判断函数集合
http://jc-dreaming.iteye.com/blog/754690 /** *判断对象是否为空 *Check whether string s is empty. */ funct ...
- 常见URL字符及URL编码值
大家上网的时候一定会看到很多这类情况有的网页地址都是%22%32%11%23%21等这种机器语言恐怕只有机器能马上辨认吧现在我把大概知道的总结一下 字符 ...
- C# Debug
语法.IDE环境使用.Debug方法是学习一门语言的最少必须技能,本文总结C#中的最常用调试方法 一. 断点 如下图所示在欲插入断点的地方右键>断点>插入断点(或在行号左边点击)可在选中语 ...
- 转 redis使用场景 简介
Redis实战(五) 聊聊Redis使用场景 发表于 2016-11-21 | 数据存储 | Redis 文章目录 1. 使用场景说明 1.1. 计数器 1.2. 排行榜 1.3. 用于存储时间戳 1 ...
- AutoFac文档12(转载)
目录 开始 Registering components 控制范围和生命周期 用模块结构化Autofac xml配置 与.net集成 深入理解Autofac 指导 关于 词汇表 Resolve的参数 ...
- struts2开发流程及配置,域对象对数据存储的3种方式
一.开发流程 1)引入 jar 包,其中必须引入的有(我是用的struts是2.3.32) commons-fileupload-1.3.2.jar |文件上传下载commons-io-2.2 ...
- Android Study 之 初识ButterKnife(8.5.1)及简单运用
LZ-Says:突然间不知道说什么好,祝大家编码无bug吧~ 前言 话说,Android开发的兄弟们都知道,每次初始化控件,设置对应的事件.写的那点过程多并且恶心.我们先一块回想下不堪的以前~ 那些年 ...