jquery 动态查询，无刷新分页

写好长没保存，还要重新写了。。。。。。。。。。

首先要从service层得到一个基础对象(包含一个List属性和其他所需属性)，然后把基础对象包装成jsonObject代码如下：

JSONObject jsonObject=new  JSONObject(reportBase,false);reportBase就是这个基础对象引用，

然后转换成字符串发送到客户端   return toClient(jsonObject.toString());

在客户端进行接收，解析，代码如下：

$.ajax({
   url: '/market/daily.action?',
   type: 'POST',
   data: "startDate="+startDate+"&endDate="+endDate+"&busId="+busId+"&dqy="+dqy+"&pageSize="+pageSize,
   success: function(data){
    //alert(data);
    eval("data = " + data);//通过eval解析action传来的data
    $("#report").remove();//移除下面创建的table，以便与在此创建

    // 通过$('')创建表单对象
    var tableObject = $('<table></table>').att({width:"100%",border:"0",cellspacing:"0",cellpadding:"0",id:"report"});
//通过jquery的each方法遍历list，并获取其中的值，create()创建td，这个是我自定义方法，    

$.each(data.list,function (index,value){
     var tr = $('<tr></tr>').append(creatTd(value.time,'20%')).append(creatTd(value.busName,'30%')).append(creatTh(value.countSum,'20%')).append(creatTh(value.countSuc,'30%'));
     tableObject.append(tr);
    });

添加到页面的div中：$('#dataDiv').append(tableObject);

 

下面就是分页了：

if(data.dqy > 1){

                //通过调用上面的js方法getReport()进行动态显示，通过传入值不同，查询数据也不相同

   //这点儿就遇到一点问题了，在点击下一页时，重复调用getReport()方法时，传日期参数，

传入的是"2009-1-1"但是进行过异步提交后（或许不是，我是这样认为的）日期就会

//自动进行减法运算变成2007了，成为一个数字了，解决方法：把日期的"-"去掉，用startDate=startDate.replace(/-/g,"");

//然而传过去就变成一个数字类型的了，下次执行时就不能用replace方法了，用startDate+="";把数字类型转换成字符串

问题就解决了
       temp=$('<a></a>').attr({href:"javascript:getReport("+1+","+pageSize+","+startDate+","+endDate+");"}).append("首页");
       html.append(temp);
       temp=$('<a></a>').attr({href:"javascript:getReport("+temppre+","+pageSize+","+startDate+","+endDate+");"}).append("上一页");
       html.append(temp);
   }else{
       temp=$('<span></span>').append("首页");
       html.append(temp);
       temp=$('<span></span>').append("上一页");
       html.append(temp); 
   }
   if (data.dqy < data.pageTotal){
       temp=$('<a></a>').attr({href:"javascript:getReport("+tempnext+","+pageSize+","+startDate+","+endDate+");"}).append("下一页");
       html.append(temp);
       temp=$('<a></a>').attr({href:"javascript:getReport("+temppageTotal+","+pageSize+","+startDate+","+endDate+");"}).append("尾页");
       html.append(temp);
   }else{
       temp=$('<span></span>').append("下一页");
       html.append(temp);
       temp=$('<span></span>').append("尾页");
       html.append(temp);    
   }

也可以这样：$("#page-next").live('click',function(){
    getReport(currPage+1)  }); 通过对下一页按钮进行click绑定，也能实现就不用像上面这么麻烦了，

刚开始用$("#page-next").bind('click', getReport(currPage+1)  );但是这样对所用按钮绑定的操作会自动执行

所以选择了live()，live方法防治js冒泡，但是支持的操作较少，是1.3的新方法，开始没有用function包装，会报错（这点查了好长时间才搞定，以后要注意）

这样就可以实现了

              仅用于个人备忘。。。