jQuery无刷新翻页,更改排序,同时带添加,修改,删除数据
2014-10-21 15:12
686 查看
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);
}
?>
原文地址:http://www.freejs.net/article_biaodan_174.html
相关文章推荐
- 用户名查询、手机号查询、选择城市、选择状态、选择月份、ID排序、添加数据、批量发货、批量删除、敏感字、修改数据)
- ListView控件刷新函数(添加,删除,修改数据时刷新)
- 项目经验之:利用Jquery+HTML静态模版实现数据的展示及无刷新增加,修改,删除,分页操作!!!
- 学习篇:无刷新展示数据+分页+添加+修改+删除
- 用户表(查询数据 、添加数据 、排序 、点击删除 、修改密码 、批量删除 、全部删除)
- 安卓SQLite 根据某一字段查询一条数据 根据某一字段排序 添加 修改 删除某一字段等于某某的那一条数据
- 订单用户表2(用户名查询、手机号查询、选择城市、选择状态、选择月份、ID排序、添加数据、批量发货、批量删除、敏感字、修改数据)
- [转]十天学习PHP之第六天(PHP)----学会添加删除修改数据 (2009-11-25 14:26)
- 用Nhibernate怎么实现数据的添加、删除、修改简单程序
- 两张表数据同步 (添加、删除、修改 触发器)
- 用Nhibernate怎么实现数据的添加、删除、修改简单程序
- jquery+ashx无刷新GridView数据显示插件(实现分页、排序、过滤功能)
- 树形数据处理方案 收藏 树形数据的排序,新增,修改,复制,删除,数据完整性检查,汇总统计
- 用jQuery中的Ajax方法,进行无刷新修改类别(可以是任何数据)的办法
- LINUX C 数据文件的添加,修改,删除 实例
- C#对DataGridView中的数据进行添加、修改、删除操作
- Silverlight 3 关于数据添加,删除,修改,条件查询的一点代码
- c# xml添加 删除 修改数据
- 对DataGridView进行添加、修改、删除数据操作----C#
- 实现datagridview中数据的添加,更改,删除功能