ajax分页与组合查询配合使用

使用纯HTML页与js、ajax、Linq实现分页与组合查询的配合使用

<body>
    <div id="top"><input type="button" id="btn1" class="btn" value="刷新" /></div>
    <div style="position:relative;text-align:center;height:50px">
        商品名：<input type="text" id="tx1" />
        &nbsp;价格<input type="text" id="tx2" />～<input type="text" id="tx3" />
        <input type="button" id="btt" value="查询" style="cursor:pointer"/>
    </div>
    <div style="position:relative;">
        <table id="tb1" style="background-color: #00ffff ; text-align: center; width: 100%;">
            <thead>
                <tr style="color: #ff6a00;">
                    <td>商品名</td>
                    <td>图片</td>
                    <td>数量</td>
                    <td>尺寸</td>
                    <td>CPU</td>
                    <td>价格</td>
                    <td>操作</td>
                </tr>
            </thead>
            <tbody>
                <!--<tr style="background-color: white;">
                    <td></td>
                </tr>-->
            </tbody>
        </table>
    </div>
    <div id="ye">
        当前第&nbsp<span id="nowye">1</span>&nbsp页&nbsp&nbsp共&nbsp<span id="allye"></span>&nbsp页
        <input id="btn_first" type="button" value="首页" />&nbsp<input id="btn_prev" type="button" value="上一页" />&nbsp<input type="button" id="btn_next" value="下一页" />&nbsp<input type="button" id="btn_end" value="末页" />
        <select id="dr1"></select>
    </div>
</body>

HTML代码

js与ajax代码：

  1 <script>
  2     var pcount = 4;
  3     var Mcount = 0;
  4     var aname = "0";
  5     var aprice = "0";
  6     var bprice ="0";
  7     var NowNumber = parseInt($("#nowye").text());
  8     data();
  9     max();
 10     //点击刷新按钮
 11     $("#btn1").click(function () {
 12         data();
 13     })
 14     //上一页
 15     $("#btn_prev").click(function () {
 16 
 17          NowNumber = parseInt($("#nowye").text()) - 1;
 18         if (NowNumber<1)
 19         {
 20             return;
 21         }
 22         data();        
 23     }
 24     );
 25     //首页
 26     $("#btn_first").click(function () {
 27 
 28         NowNumber = 1;
 29         data();
 30     }
 31     
 32    );
 33     //末页
 34     $("#btn_end").click(function () {
 35 
 36         NowNumber = parseInt($("#allye").text());
 37         data();
 38     }
 39 
 40  );
 41     //快捷跳转
 42     $("#dr1").change(function () {
 43         NowNumber = parseInt($("#dr1").val());
 44         data();
 45     }
 46 
 47         );
 48     //下一页
 49     $("#btn_next").click(function () {
 50 
 51         NowNumber = parseInt($("#nowye").text()) + 1;
 52         if (NowNumber > parseInt($("#allye").text())) {
 53             return;
 54         }
 55         data();
 56     }
 57   );
 58     //点击查询按钮
 59     $("#btt").click(function () {
 60         aname = $("#tx1").val();
 61         aprice = $("#tx2").val();
 62         bprice = $("#tx3").val();
 63         NowNumber = 1;
 64         max();
 65         data();
 66     })
 67     //获取总页数与绑定快捷页数
 68     function max() {
 69         $.ajax({
 70             url: "ajax/allcom.ashx",
 71             data: { "ak": aname, "bk": aprice, "ck": bprice },
 72             type: "post",
 73             dataType: "json",
 74             success: function (data) {
 75                 var maxcount = data.cn;
 76                 var te = maxcount / (pcount * 1.0);
 77                 Mcount = Math.ceil(te);
 78                 $("#allye").html(Mcount);
 79                 $("#dr1").empty();
 80                 for(var i=1;i<=Mcount;i++)
 81                 {
 82                     var str = "<option value=\"" + i + "\">" + i + "</option>";
 83                     $("#dr1").append(str);
 84                 }
 85                 
 86             },
 87             error: function () {
 88                 alert('服务器连接失败！！！');
 89             },
 90             beforeSend: function () {
 91 
 92             }
 93 
 94         });
 95     }
 96     //数据展现
 97     function data() {
 98         $.ajax({
 99             url: "ajax/com.ashx",
100             data: {"un":NowNumber,"yn":pcount,"ak":aname,"bk":aprice,"ck":bprice},
101             type: "post",
102             dataType: "json",
103             success: function (data) {
104                 $("#tb1 tbody").empty();//清空tbody
105                 for (i in data) {
106                     var str = "<tr style=\"background-color: #a9ff98;  \" class=\"trs\">";
107                     str += "<td>" + data[i].pname + "</td>";
108                     str += "<td>  <img src=\""+ data[i].pic +"\" style=\"width:60px;height:60px\"/> </td>";
109                     str += "<td>" + data[i].pcode + "</td>";
110                     str += "<td>" + data[i].size + "</td>";
111                     str += "<td>" + data[i].cpu + "</td>";
112                     str += "<td>" + data[i].price + "</td>";
113                     str += "<td> <input type=\"button\" class=\"btn2\"  value=\"删除\" /> </td>";
114                     str += "</tr>";
115                     $("#tb1 tbody").append(str);
116                     $("#nowye").html(NowNumber);
117                     $("#dr1").val(NowNumber);
118                 }
119             },
120             error: function () {
121                 alert('服务器连接失败！！！');
122             },
123             beforeSend: function () {
124                
125             }
126 
127         });
128 
129     };
130 </script>

 1  public void ProcessRequest(HttpContext context)
 2     {
 3         int pcount = Convert.ToInt32(context.Request["yn"]);
 4         int pagenumber = Convert.ToInt32(context.Request["un"]);
 5         string sname = context.Request["ak"];
 6         int sprice1;
 7         int sprice2;
 8         try
 9         {
10             sprice1 = Convert.ToInt32(context.Request["bk"]);
11         }
12         catch
13         {
14             sprice1 = 0;
15         }
16         try
17         {
18             sprice2 = Convert.ToInt32(context.Request["ck"]);
19         }
20         catch
21         {
22             sprice2 = 0;
23         }
24         int count = 0;
25         string end = "[";
26         using (WebDataContext con = new WebDataContext())
27         {
28 
29             var clist = con.Computer.AsEnumerable();
30             if (sname!="0")
31             {
32                 var namelist = con.Computer.Where(r => r.Name.Contains(sname));
33 
34                 clist = clist.Intersect(namelist);
35             }
36             if (sprice1 != 0)
37             {
38                 var plist = con.Computer.Where(r => Convert.ToInt32(r.price) >= sprice1);
39                 clist = clist.Intersect(plist);
40             }
41             if (sprice2 != 0)
42             {
43                      var plist2 = con.Computer.Where(r => Convert.ToInt32(r.price) <= sprice2);
44                 clist = clist.Intersect(plist2);
45             }
46 
47             clist = clist.Skip(pcount * (pagenumber - 1)).Take(pcount);
48             foreach (Computer c in clist)
49             {
50                 //前面有数据
51                 if (count > 0)
52                 {
53                     end += ",";
54                 }
55                 end += "{\"pname\":\"" + c.Name + "\",\"size\": \"" + c.size + "\",\"cpu\": \"" + c.Cpu + "\",\"price\": \"" + c.price + "\",\"pic\": \"" + c.pic + "\",\"pcode\":\"" + c.pcode + "\",\"pid\":\"" + c.ids + "\" }";
56                 count++;
57             }
58         }
59         end += "]";
60         context.Response.Write(end);
61         context.Response.End();
62 
63     }

com.ashx

 1  public void ProcessRequest (HttpContext context) {
 2             string sname = context.Request["ak"];
 3         int sprice1;
 4         int sprice2;
 5         try
 6         {
 7             sprice1 = Convert.ToInt32(context.Request["bk"]);
 8         }
 9         catch
10         {
11             sprice1 = 0;
12         }
13         try
14         {
15             sprice2 = Convert.ToInt32(context.Request["ck"]);
16         }
17         catch
18         {
19             sprice2 = 0;
20         }
21             string end="";
22         using (WebDataContext con = new WebDataContext())
23         {
24                 
25             var clist = con.Computer.AsEnumerable();
26             if (sname!="0")
27             {
28                 var namelist = con.Computer.Where(r => r.Name.Contains(sname));
29 
30                 clist = clist.Intersect(namelist);
31             }
32             if (sprice1 != 0)
33             {
34                 var plist = con.Computer.Where(r => Convert.ToInt32(r.price) >= sprice1);
35                 clist = clist.Intersect(plist);
36             }
37             if (sprice2 != 0)
38             {
39                      var plist2 = con.Computer.Where(r => Convert.ToInt32(r.price) <= sprice2);
40                 clist = clist.Intersect(plist2);
41             }
42              end = "{\"cn\":\"" + clist.Count() + "\"}";
43         }
44         context.Response.Write(end);
45         context.Response.End();
46     }

allcom.ashx

posted on 2016-11-17 19:24 fei！阅读(355) 评论(0) 编辑收藏举报