首页 > 代码库 > jQuery、Ajax分页
jQuery、Ajax分页
1、效果图预览
2、HTML代码
<div class="row"> <div class="col-lg-12 col-sm-12 col-xs-12 col-xxs-12"> <table class="table table-striped table-hover table-bordered bootstrap-datatable " id="TemplateTable"> <thead> <tr> <td>模板名称</td> <td style="width: 400px;">短信内容</td> <td>操作</td> </tr> </thead> <tbody> </tbody> </table> </div> </div> <div class="row" style="margin-top: 15px;"> <div class="col-lg-12 col-sm-12 col-xs-12 col-xxs-12"> <div style="font-size: 14px;">共<label style="color: #20A8D8; font-size: 14px;" id="pageCount">0</label>条记录</div> </div> </div> <div class="row"> <div class="col-lg-12 col-sm-12 col-xs-12 col-xxs-12"> <div id="MainContent_AspNetPager_Msg" class="paginator"> <a style="margin-right: 5px; cursor: pointer;" href="javascript:void(0)" onclick="PageIndexClick(this)" id="FirstPage" pageindex="1">首 页 </a> <a style="margin-right: 5px; cursor: pointer;" href="javascript:void(0)" onclick="PageIndexClick(this)" id="TopPage" pageindex="0">← 上一页</a> <span class="cpb" style="margin-right: 5px; cursor: pointer;" id="CurrenPageSize">1</span> <a style="margin-right: 5px; cursor: pointer;" href="javascript:void(0)" onclick="PageIndexClick(this)" id="NextPage" pageindex="0">→ 下一页</a> <a style="margin-right: 5px; cursor: pointer;" href="javascript:void(0)" onclick="PageIndexClick(this)" id="LastPage" pageindex="0"> 尾 页 </a> </div> </div> </div>
3、JS代码
//加载短信模板内容-分页 function TemplateAjax() { $('#TemplateTable tbody tr').remove();//清空Table tbody AjaxPage(1, PageSize); } //当前页,显示条数 function AjaxPage(curpage, PageSize) { //省 var ProvinceId = $('#MainContent_ddlsheng').val(); //市 var CityId = $('#MainContent_ddlshi').val(); $.ajax({ cache: false, url: "/ajaxpage/getajax.aspx?t=smsplateformtemplateajaxpage&ProvinceId=" + ProvinceId + "&CityId=" + CityId + "&CurPage=" + curpage + "&PageSize=" + PageSize + "&a=" + Math.random(), dataType: 'json', success: function (data) { if (data != null) { var str = ''; for (var i in data["Data"]) { var Content = data["Data"][i]["SmsTemplateContent"]; if (Content.length >= 60) { Content = Content.substring(0, 60); } str += "<tr><td>" + data["Data"][i]["SmsTemplateName"] + "</td><td>" + Content + "</td><td><input type='button' value=http://www.mamicode.com/' 删 除 ' class='btn btn-primary' onclick='TemplateDelete(" + data["Data"][i]["Id"] + ")'/>";>4、C#后台代码
if(Request.QueryString["t"] == "smsplateformtemplateajaxpage") { try { string ProvinceId = Request.QueryString["ProvinceId"]; string CityId = Request.QueryString["CityId"]; int CurPage = 1;//当前第几页 int.TryParse(Request.QueryString["CurPage"], out CurPage); int PageSize = 5;//每页显示多少条数据 int.TryParse(Request.QueryString["PageSize"], out PageSize); StringBuilder sb = new StringBuilder(); sb.Append(" 1=1 and (delete_flag IS NULL OR delete_flag=0)"); //省 if (ProvinceId != null && !string.IsNullOrEmpty(ProvinceId) && ProvinceId != "0") { sb.Append(string.Format(" and ProvinceId={0} ", ProvinceId.Trim())); } //市 if (!string.IsNullOrEmpty(CityId) && CityId != "0" && CityId != "null") { sb.Append(string.Format(" and CityId={0} ", CityId.Trim())); } PageArgs pageArgs = new PageArgs(); pageArgs.PageSize = PageSize; pageArgs.PageIndex = CurPage; pageArgs.TableName = "D_SMSTemplate"; pageArgs.PrimaryKey = "Id"; pageArgs.Fields = ""; pageArgs.Filter = sb.ToString(); pageArgs.Order = " create_time desc"; IList<SMSTemplateEntity> list = new SMSTemplateBLL().GetSMSTemplateAll(ref pageArgs); List<Dictionary<string, object>> li = new List<Dictionary<string, object>>(); Dictionary<string, object> dic = new Dictionary<string, object>(); dic.Add("RecordCount", pageArgs.RecordCount);//总条数 dic.Add("Data", list); JavaScriptSerializer serializer = new JavaScriptSerializer(); var result = serializer.Serialize(dic); Response.Write(result); } catch { Response.Write(null); } }
声明:以上内容来自用户投稿及互联网公开渠道收集整理发布,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任,若内容有误或涉及侵权可进行投诉: 投诉/举报 工作人员会在5个工作日内联系你,一经查实,本站将立刻删除涉嫌侵权内容。