最近在用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({

url:url+gurl,

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(其中有搜索)分页的更多相关文章

  1. 页面中的删除确认(ajax)、输入框中确认信息是否可用(ajax)的jquery代码

    1.页面中的删除确认(ajax) <%@ page language="java" contentType="text/html; charset=UTF-8&qu ...

  2. laravel中form表单,ajax传值没反应

    laravel中form表单,ajax传值没反应时,可能是令牌有问题. form中添加: {{csrf_token()}} ajax中添加: data: {'page': page, '_token' ...

  3. thinkphp ajax 无刷新分页效果的实现

    思路:先做出传统分页效果,然后重新复制一份Page.class.php类,对它进行修改,把js中的函数传到page类中,把上一页.下一页.首页.尾页.链接页中的url地址改成js控制的函数,模板页面中 ...

  4. thinkphp下实现ajax无刷新分页

    1.前言 作为一名php程序员,我们开发网站主要就是为了客户从客户端进行体验,在这里,thinkphp框架自带的分页类是每次翻页都要刷新一下整个页面,这种翻页的用户体验显然是不太理想的,我们希望每次翻 ...

  5. PHP 实例 - AJAX 实时搜索-AJAX Live Search

    PHP 实例 - AJAX 实时搜索 AJAX 可为用户提供更友好.交互性更强的搜索体验. AJAX Live Search 在下面的实例中,我们将演示一个实时的搜索,在您键入数据的同时即可得到搜索结 ...

  6. ajax 无刷新分页

    //ajax 无刷新分页1.前台要做的 滑动时 当前page+1,通过page ajax请求后台接口获取数据将数据进行拼装;2.后台要做的 做分页接口返回json数据前台判断触发请求条件: var p ...

  7. 转:SQL SERVER数据库中实现快速的数据提取和数据分页

    探讨如何在有着1000万条数据的MS SQL SERVER数据库中实现快速的数据提取和数据分页.以下代码说明了我们实例中数据库的“红头文件”一表的部分数据结构: CREATE TABLE [dbo]. ...

  8. Yii 框架ajax搜索分页

    要想实现ajax搜索分页 其实很简单 第一步:在 Yii 框架自带的搜索和分页正常运行的情况下,在视图层

  9. 关于Ajax无刷新分页技术的一些研究 c#

    关于Ajax无刷新分页技术的一些研究 c# 小弟新手,求大神有更好的解决方案,指教下~ 以前做项目,用过GridView的刷新分页,也用过EasyUI的封装好的分页技术,最近在老项目的基础上加新功能, ...

随机推荐

  1. ArrayList和LinkedList的几种循环遍历方式及性能对比分析

    最新最准确内容建议直接访问原文:ArrayList和LinkedList的几种循环遍历方式及性能对比分析 主要介绍ArrayList和LinkedList这两种list的五种循环遍历方式,各种方式的性 ...

  2. Python与Hack之Zip文件口令破解

    1.需要的库: **import zipfile**import optparse**from threading import Thread(1)zipfile:1.1 zipfile.ZipFil ...

  3. 2016.9.14 JavaScript入门之七面向对象和函数

    1.JavaScript中的变量,可以是对象,具有相应的属性: 2.我们也能够使用构造函数创建对象.构造函数的函数给出了一个大写的名称,以使它清楚地表明它是一个构造函数. 在构造函数中,这个变量是指由 ...

  4. POJ 2774 后缀数组

    题目链接:http://poj.org/problem?id=2774 题意:给定两个只含小写字母的字符串,求字符串的最长公共子串长度. 思路:根据<<后缀数组——处理字符串的有力工具&g ...

  5. 02 CSS/javaScript

    CSS(Cascading Style Sheets)是层叠样式表用来设置网页的显示效果.可以解决html代码对样式定义的重复,提高了后期样式代码的可维护性,并增强了网页的显示效果功能.简单一句话:C ...

  6. 我的c++学习(8)运算符重载和友元

    运算符的重载,实际是一种特殊的函数重载,必须定义一个函数,并告诉C++编译器,当遇到该运算符时就调用此函数来行使运算符功能.这个函数叫做运算符重载函数(常为类的成员函数). 方法与解释 ◆ 1.定义运 ...

  7. BZOJ3979 : [WF2012]infiltration

    答案是$O(\log n)$级别的,故答案不超过6. 当答案是12345时,暴力枚举+压位检验即可,否则直接输出6. 时间复杂度$O(n^5)$. #include<cstdio> #de ...

  8. BZOJ4367 : [IOI2014]holiday假期

    设 $fl[i]$表示从$S$向左走,用了不超过$i$天且不回头的最大收益. $fr[i]$表示从$S$向右走,用了不超过$i$天且不回头的最大收益. $gl[i]$表示从$S$向左走,用了不超过$i ...

  9. 使用javax.persistence注解配置PO对象

    JPA注解持久化类很方便,需要jar包:ejb3-persistence.jar下载 import java.io.Serializable; import javax.persistence.Col ...

  10. OpenResty+lua+GraphicsMagick生成缩略图

    1.安装GraphicsMagick 下载地址:http://sourceforge.net/projects/graphicsmagick/files/graphicsmagick/1.3.19/G ...