jQuery无刷新翻页，更改排序，同时带添加，修改，删除数据

恋雨烟梦

2014-04-10

jQuery无刷新翻页，更改排序，同时带添加，修改，删除数据

本例用到的js库请到演示页面

XML/HTML Code
<div id="PeopleTableContainer" style="width: 600px;"></div>  

JavaScript Code
<script type="text/javascript">  
  
        $(document).ready(function () {  
  
            //Prepare jTable  
            $('#PeopleTableContainer').jtable({  
                title: 'Table of people',  
                paging: true,  
                pageSize: 3,  
                sorting: true,  
                defaultSorting: 'Name ASC',  
                actions: {  
                    listAction: 'PersonActionsPagedSorted.php?action=list',  
                    createAction: 'PersonActionsPagedSorted.php?action=create',  
                    updateAction: 'PersonActionsPagedSorted.php?action=update',  
                    deleteAction: 'PersonActionsPagedSorted.php?action=delete'  
                },  
                fields: {  
                    PersonId: {  
                        key: true,  
                        create: false,  
                        edit: false,  
                        list: false  
                    },  
                    Name: {  
                        title: 'Author Name',  
                        width: '40%'  
                    },  
                    Age: {  
                        title: 'Age',  
                        width: '20%'  
                    },  
                    RecordDate: {  
                        title: 'Record date',  
                        width: '30%',  
                        type: 'date',  
                        create: false,  
                        edit: false  
                    }  
                }  
            });  
  
            //Load person list from server  
            $('#PeopleTableContainer').jtable('load');  
  
        });  
  
    </script>  
   

PersonActions.php

PHP Code
<?php  
  
try  
{  
    include("../../conn.php");  
  
    //Getting records (listAction)  
    if($_GET["action"] == "list")  
    {  
        //Get record count  
        $result = mysql_query("SELECT COUNT(*) AS RecordCount FROM people;");  
        $row = mysql_fetch_array($result);  
        $recordCount = $row['RecordCount'];  
  
        //Get records from database  
        $result = mysql_query("SELECT * FROM people ORDER BY " . $_GET["jtSorting"] . " LIMIT " . $_GET["jtStartIndex"] . "," . $_GET["jtPageSize"] . ";");  
          
        //Add all records to an array  
        $rows = array();  
        while($row = mysql_fetch_array($result))  
        {  
            $rows[] = $row;  
        }  
  
        //Return result to jTable  
        $jTableResult = array();  
        $jTableResult['Result'] = "OK";  
        $jTableResult['TotalRecordCount'] = $recordCount;  
        $jTableResult['Records'] = $rows;  
        print json_encode($jTableResult);  
    }  
    //Creating a new record (createAction)  
    else if($_GET["action"] == "create")  
    {  
        //Insert record into database  
        $result = mysql_query("INSERT INTO people(Name, Age, RecordDate) VALUES('" . $_POST["Name"] . "', " . $_POST["Age"] . ",now());");  
          
        //Get last inserted record (to return to jTable)  
        $result = mysql_query("SELECT * FROM people WHERE PersonId = LAST_INSERT_ID();");  
        $row = mysql_fetch_array($result);  
  
        //Return result to jTable  
        $jTableResult = array();  
        $jTableResult['Result'] = "OK";  
        $jTableResult['Record'] = $row;  
        print json_encode($jTableResult);  
    }  
    //Updating a record (updateAction)  
    else if($_GET["action"] == "update")  
    {  
        //Update record in database  
        $result = mysql_query("UPDATE people SET Name = '" . $_POST["Name"] . "', Age = " . $_POST["Age"] . " WHERE PersonId = " . $_POST["PersonId"] . ";");  
  
        //Return result to jTable  
        $jTableResult = array();  
        $jTableResult['Result'] = "OK";  
        print json_encode($jTableResult);  
    }  
    //Deleting a record (deleteAction)  
    else if($_GET["action"] == "delete")  
    {  
        //Delete from database  
        $result = mysql_query("DELETE FROM people WHERE PersonId = " . $_POST["PersonId"] . ";");  
  
        //Return result to jTable  
        $jTableResult = array();  
        $jTableResult['Result'] = "OK";  
        print json_encode($jTableResult);  
    }  
  
    //Close database connection  
      
  
}  
catch(Exception $ex)  
{  
    //Return error message  
    $jTableResult = array();  
    $jTableResult['Result'] = "ERROR";  
    $jTableResult['Message'] = $ex->getMessage();  
    print json_encode($jTableResult);  
}  
      
?>  