本人新手,刚刚学习php,昨天第一次接触extjs。在网上查了一些资料,现做了通过用mysql+php+extjs做了一个分页的数据查询的表页。有两个文件 exttest.php 和 page.php 现在page.php 中的
$start = isset($_POST['start']) ? $_POST['start']:0;
$limit = isset($_POST['limit']) ? $_POST['limit']:3;
不知道如何取到 exttest.php 中的 start 和limit ,所以现在运行后 比如数据库有15条,每页显示3条,则显示5页。现在5页每页的3条结果都是一样的,就是始终只取了前3条。不知道怎样修改,请各位大侠帮忙。(理论上应该是 一开始给extjs中赋值start 0,page.php程序中获得$start=0,然后获得3条结果显示。点击下一页时,调用的extjs组件会自动将exttest.php 中start赋值为start+limit ,这样start=3,再传递给page.php 的$start,使$start=3,这样相当于从数据库的第四条记录开始查询接下来的三条。这样理解不知道可对。)程序如下:
page.php<?php error_reporting(0); $link = mysql_pconnect("localhost", "root", "1")
or die("Could not connect");
mysql_select_db("dbtest") or die("Could not select database");
$sql_count = "SELECT * FROM stud";
$start = isset($_POST['start']) ? $_POST['start']:0;
$limit = isset($_POST['limit']) ? $_POST['limit']:3; $sql = $sql_count . " LIMIT ".$start.", ".$limit ;
$rs_count = mysql_query($sql_count);
$rows = mysql_num_rows($rs_count);
$rs = mysql_query($sql);
while($obj = mysql_fetch_object($rs))
{
$arr[] = $obj;
}
//get result
echo '{"totalProperty":"'.$rows.'","results":'.json_encode($arr).'}'; ?>
exttest.php
<HEAD>
<TITLE>Ext.grid.column.Column示例</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="ext-4.0/resources/css/ext-all.css" /> </HEAD> <BODY STYLE="margin: 10px"> <script type="text/javascript" src="ext-4.0/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.0/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(
function(){
var itemsPerPage = 3;//指定分页大小
var store = Ext.create('Ext.data.Store', {
autoLoad: {start: 0, limit: itemsPerPage},
fields:['id', 'name', 'age'],
pageSize: itemsPerPage, //设置分页大小
proxy: {
type: 'ajax',
url: 'page.php', //请求的服务器地址
reader: {
type: 'json',
root: 'results',
totalProperty: 'totalProperty'
}
} });
//创建Grid表格组件
Ext.create('Ext.grid.Panel',{
title : 'Ext.grid.column.Column示例',
renderTo: Ext.getBody(),
width:500,
height:550,
frame:true,
store: store,
columns: [//配置表格列
{header: "id", width: 30, dataIndex: 'id', sortable: true},
{header: "姓名", width: 80, dataIndex: 'name', sortable: true},
{header: "年龄", width: 80, dataIndex: 'age', sortable: true}
],
bbar: [{
xtype: 'pagingtoolbar',
store: store, //这里需要指定与表格相同的store
displayInfo: true
}]
});
});
</script>
</BODY>
$start = isset($_POST['start']) ? $_POST['start']:0;
$limit = isset($_POST['limit']) ? $_POST['limit']:3;
不知道如何取到 exttest.php 中的 start 和limit ,所以现在运行后 比如数据库有15条,每页显示3条,则显示5页。现在5页每页的3条结果都是一样的,就是始终只取了前3条。不知道怎样修改,请各位大侠帮忙。(理论上应该是 一开始给extjs中赋值start 0,page.php程序中获得$start=0,然后获得3条结果显示。点击下一页时,调用的extjs组件会自动将exttest.php 中start赋值为start+limit ,这样start=3,再传递给page.php 的$start,使$start=3,这样相当于从数据库的第四条记录开始查询接下来的三条。这样理解不知道可对。)程序如下:
page.php<?php error_reporting(0); $link = mysql_pconnect("localhost", "root", "1")
or die("Could not connect");
mysql_select_db("dbtest") or die("Could not select database");
$sql_count = "SELECT * FROM stud";
$start = isset($_POST['start']) ? $_POST['start']:0;
$limit = isset($_POST['limit']) ? $_POST['limit']:3; $sql = $sql_count . " LIMIT ".$start.", ".$limit ;
$rs_count = mysql_query($sql_count);
$rows = mysql_num_rows($rs_count);
$rs = mysql_query($sql);
while($obj = mysql_fetch_object($rs))
{
$arr[] = $obj;
}
//get result
echo '{"totalProperty":"'.$rows.'","results":'.json_encode($arr).'}'; ?>
exttest.php
<HEAD>
<TITLE>Ext.grid.column.Column示例</TITLE>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<link rel="stylesheet" type="text/css" href="ext-4.0/resources/css/ext-all.css" /> </HEAD> <BODY STYLE="margin: 10px"> <script type="text/javascript" src="ext-4.0/bootstrap.js"></script>
<script type="text/javascript" src="ext-4.0/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
Ext.onReady(
function(){
var itemsPerPage = 3;//指定分页大小
var store = Ext.create('Ext.data.Store', {
autoLoad: {start: 0, limit: itemsPerPage},
fields:['id', 'name', 'age'],
pageSize: itemsPerPage, //设置分页大小
proxy: {
type: 'ajax',
url: 'page.php', //请求的服务器地址
reader: {
type: 'json',
root: 'results',
totalProperty: 'totalProperty'
}
} });
//创建Grid表格组件
Ext.create('Ext.grid.Panel',{
title : 'Ext.grid.column.Column示例',
renderTo: Ext.getBody(),
width:500,
height:550,
frame:true,
store: store,
columns: [//配置表格列
{header: "id", width: 30, dataIndex: 'id', sortable: true},
{header: "姓名", width: 80, dataIndex: 'name', sortable: true},
{header: "年龄", width: 80, dataIndex: 'age', sortable: true}
],
bbar: [{
xtype: 'pagingtoolbar',
store: store, //这里需要指定与表格相同的store
displayInfo: true
}]
});
});
</script>
</BODY>
修改如下
$start = isset($_GET['start']) ? $_GET['start']:0;
$limit = isset($_GET['limit']) ? $_GET['limit']:3; exttest.php 增加 method: 'GET',
proxy: {
method: 'GET',
type: 'ajax',
url: 'apage.php', //请求的服务器地址
reader: {
type: 'json',
root: 'results',
totalProperty: 'totalProperty'
}
}用GET传递就可以了。