zendFream 中的用到了Ajax(其中有搜索)分页
最近在用ZendFreamwork开发一个后台,其中用到了分页,ZendFreamwork自带的分页挺好用的,可是我其中用到了Ajax的局部刷新,在加上一些搜索条件,所以分页有点无头绪了。下面我来介绍下我的方法:
1.首页我这个页面有两种选择情况我用a(渠道)和b(应用) 代替了,如果搜索的条件是a中的,那么就执行a 方法,如果是b 就执行b 方法,只刷新下边的列表部分
这里面php部分不说了,ZendFreamwork的分页可以看下手册,只说其中我认为最重要的(关键当时这个地方不会)
我的模板页面都是用js写的如何传参和执行的php方法名称:(可能写的不是很好,请见谅)
html页面:
<dl>
<dt>渠道:<input type="radio" name="type" value="1" checked="checked" /></dt>
<dd>
选择渠道<select name="cid" id="cid" title="渠道" class="add-text">
<option value="0">请选择</option>
<option value="1">博客园</option>
</select>
选择包<select name="q_pid" id="q_pid" title="当前资源" class="add-text">
<option value="">请选择资源</option>
</select>
<dd>
</dl>
<dl>
<dt>应用:<input type='radio" name="type" value="2" /></dt>
<dd>
选择应用:<select name="pro" id="pid" title="应用" class="add-text">
<option value="0">请选择</option>
<option value="1">博客园</option>
</select>
选择包: <select name="pid" id="y_pid" title="当前资源" class="add-text">
<option value="">请选择资源</option>
</select>
</dd>
</dl>
<script type="text/javascript">
var showReport = (function(){
function showList(type,date,cid,y_pid,q_pid,pid){
var url = "";
switch(type){
case "1":
url = "/data/xiang/showpk";
break;
case "2":
url = "/data/xiang/show";
break;
default:
url = "/data/xiang/showpk";
break;
}
$.ajax({
url:url,
data:{
date:date,cid:cid,y_pid:y_pid,q_pid:q_pid,pid:pid
},
type:"post",
dataType:"html",
success:function(data){
$("div#divTable").html(data).show(300);
}
});
}
})();
$(function(){
//选择应用时刷新对应的包
$("#pid").change(function(){
var url = "/data/xiang/getpackages";
var sql = "pid";
Ajaxpackages($("#pid").val(),$("#y_pid"),url,sql);//pid,包id,Ajax地址,php页面字段名
});
if($("#pid").val()){
var url = "/data/xiang/getpackages";
var sql = "pid";
Ajaxpackages($("#pid").val(),$("#y_pid"),url,sql);
}
//选择渠道时刷新对应的包
$("#cid").change(function(){
var url = "/data/xiang/getpackages";
var sql = "cid";
Ajaxpackages($("#cid").val(),$("#q_pid"),url,sql);//cid,包id,Ajax地址,php页面字段名
});
if($("#cid").val()){
var url = "/data/xiang/getpackages";
var sql = "cid";
Ajaxpackages($("#cid").val(),$("#q_pid"),url,sql);
}
showReport.showList("1","<?php echo $this -> views['date'];?>");//加载页面时执行
showReport.searchList();
//分页
$("#pages a").live("click",function(e){
var gurl = $(this).attr("href"); //这是a 标签的链接地址,主要用于Page的传值
var type = "1";
$("input[name='type']").each(function(){
if($(this).attr("checked")){
type = $(this).val();
}
});
var url = "";
switch(type){
case "1":
url = "/data/xiang/showpk";
break;
case "2":
url = "/data/xiang/show";
break;
default:
url = "/data/xiang/showpk";
break;
}
var date = $("input[name='date']").val();
var cid = $("#cid").val();
var q_pid = $("#q_pid").val();
var y_pid = $("#y_pid").val();
var pid = $("#pid").val();
$.ajax({
data:{
date:date,cid:cid,y_pid:y_pid,q_pid:q_pid,pid:pid
},
type:"post",
dataType:"html",
success:function(data){
$("div#divTable").html(data).show(300);
}
});
e.preventDefault();//去掉a标签的单击默认的操作
})
});
function Ajaxpackages(pid,pk,url,sql){
$.ajax({
url:url,
type:"post",
data:{pid:pid,v:new Date().getTime(),sql:sql},
success:function(data){
if(data){
var jsondata=eval(data);
var len = jsondata.length;
var selectContent = "<option value=''>资源包</option>";
for(var i=0;i<len;i++){
if(jsondata[i].acc_name){
selectContent += '<option value="'+jsondata[i].acc_id+'">'+jsondata[i].acc_name+'</option> ';
}
}
}else{
selectContent = '<option value="">--没有对应的包--</option> ';
}
pk.html(selectContent);
}
});
}
</script>
zendFream 中的用到了Ajax(其中有搜索)分页的更多相关文章
- 页面中的删除确认(ajax)、输入框中确认信息是否可用(ajax)的jquery代码
1.页面中的删除确认(ajax) <%@ page language="java" contentType="text/html; charset=UTF-8&qu ...
- laravel中form表单,ajax传值没反应
laravel中form表单,ajax传值没反应时,可能是令牌有问题. form中添加: {{csrf_token()}} ajax中添加: data: {'page': page, '_token' ...
- thinkphp ajax 无刷新分页效果的实现
思路:先做出传统分页效果,然后重新复制一份Page.class.php类,对它进行修改,把js中的函数传到page类中,把上一页.下一页.首页.尾页.链接页中的url地址改成js控制的函数,模板页面中 ...
- thinkphp下实现ajax无刷新分页
1.前言 作为一名php程序员,我们开发网站主要就是为了客户从客户端进行体验,在这里,thinkphp框架自带的分页类是每次翻页都要刷新一下整个页面,这种翻页的用户体验显然是不太理想的,我们希望每次翻 ...
- PHP 实例 - AJAX 实时搜索-AJAX Live Search
PHP 实例 - AJAX 实时搜索 AJAX 可为用户提供更友好.交互性更强的搜索体验. AJAX Live Search 在下面的实例中,我们将演示一个实时的搜索,在您键入数据的同时即可得到搜索结 ...
- ajax 无刷新分页
//ajax 无刷新分页1.前台要做的 滑动时 当前page+1,通过page ajax请求后台接口获取数据将数据进行拼装;2.后台要做的 做分页接口返回json数据前台判断触发请求条件: var p ...
- 转:SQL SERVER数据库中实现快速的数据提取和数据分页
探讨如何在有着1000万条数据的MS SQL SERVER数据库中实现快速的数据提取和数据分页.以下代码说明了我们实例中数据库的“红头文件”一表的部分数据结构: CREATE TABLE [dbo]. ...
- Yii 框架ajax搜索分页
要想实现ajax搜索分页 其实很简单 第一步:在 Yii 框架自带的搜索和分页正常运行的情况下,在视图层
- 关于Ajax无刷新分页技术的一些研究 c#
关于Ajax无刷新分页技术的一些研究 c# 小弟新手,求大神有更好的解决方案,指教下~ 以前做项目,用过GridView的刷新分页,也用过EasyUI的封装好的分页技术,最近在老项目的基础上加新功能, ...
随机推荐
- util包下的Date与sql包下的Date之间的转换
Java中的时间类型 java.sql包下给出三个与数据库相关的日期时间类型,分别是: Date:表示日期,只有年月日,没有时分秒.会丢失时间: Time:表示时间,只有时分秒,没有年月日.会丢失日期 ...
- 【hibernate criteria】hibernate中criteria的完整用法 转
---恢复内容开始--- 转自:http://www.360doc.com/content/090313/10/26262_2794855.html 1.Criteria Hibernate 设计了 ...
- AngularJS学习之全局API(应用程序编程接口)
1.AngularJS全局API用于执行常见任务的Javascript函数集合: **比较对象 **迭代对象 **转换对象 2.全局API函数使用angularJS对象进行访问:以下是通用API函数: ...
- no-jquery 01Elements
Select Elements id // IE 5.5+ document.getElementById('myElement'); // IE 8+ document.querySelector( ...
- 分享Kali Linux 2016.2第46周虚拟机
分享Kali Linux 2016.2第46周虚拟机该虚拟机使用Kali Linux 2016.2第46周的64位镜像安装.桌面为Gnome模式.该虚拟机配置如下:(1)支持VMWare 9以上的版本 ...
- 什么是智能扫描开单打印进销存POS?安卓工业手持PDA设备上的POS销售开单,现场打印打票,用扫描枪太方便了
安卓PDA版POS销售开单如果和扫描枪配合使用,和超市的POS销售一样的操作 什么是智能扫描开单打印进销存POS? 互联网特性,让它在数据统计分析.客户关系管理等方面表现出众.智能POS,不仅是一个收 ...
- tomcat 部署spring工程乱码解决方案
tomcat的server.xml文件,Connector标签增加useBodyEncodingForURI="true"属性 web.xml如下配置 <filter> ...
- section和article元素
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- myeclipse下拷贝的项目,tomcat下部署名称和导出为war包的名称默认值修改
拷贝一个项目,作为一个新的项目,给它换了名字,这时候默认的部署名称等都是原来项目的,这时候要在属性里面修改一下.
- CF# Educational Codeforces Round 3 D. Gadgets for dollars and pounds
D. Gadgets for dollars and pounds time limit per test 2 seconds memory limit per test 256 megabytes ...