zoukankan      html  css  js  c++  java
  • 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',55,editable:true},
    {name:'invdate',index:'invdate',90,editable:true},
    {name:'amount',index:'amount',80,editable:true},
    {name:'Tax',index:'Tax',80,editable:true},
    {name:'Total',index:'Total',80,editable:true},
    {name:'note',index:'note',90,editable:true}],
    pager:'#pager',
    rowNum:10,
    'auto',
    editurl: "add.php",
    autoheight:true,
    height:'auto',
    rowList:[10,20,30],
    sortname:'invid',
    viewrecords:true,
    caption:'my frist grid'
    });
    var add_options={
    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={
    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 = {
    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("Couldn’t 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 ";
    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("Couldn’t 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("Couldn’t 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("Couldn’t 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;
    }
    ?>

  • 相关阅读:
    软件项目版本号的命名规则及格式
    你必须知道的C#的25个基础概念
    Visual C#常用函数和方法集汇总
    web标准下的web开发流程思考
    设计模式(5)>模板方法 小强斋
    设计模式(9)>迭代器模式 小强斋
    设计模式(10)>策略模式 小强斋
    设计模式(8)>代理模式 小强斋
    设计模式(7)>观察者模式 小强斋
    设计模式(7)>观察者模式 小强斋
  • 原文地址:https://www.cnblogs.com/xiaocongjiejie/p/4513717.html
Copyright © 2011-2022 走看看