Bootstrap Table使用整理(五)之分页组合查询

前端之家收集整理的这篇文章主要介绍了Bootstrap Table使用整理(五)之分页组合查询前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

推荐阅读:

Bootstrap Table使用整理(一)

Bootstrap Table使用整理(二)

Bootstrap Table使用整理(三)

Bootstrap Table使用整理(四)之工具栏

一、分页组合查询

分页 * data-page-list 指定分页的页数据量数组 '[5,10]' * data-side-pagination 指定分页是否是服务端(server)/客户端(client) * 特别说明: * 客户端,请求参数: * search:文本框内容,在文本框内容改变是自动提交请求 * order: 排序方式 * sort:排序列名 * offset:划过条数 * limit:要获取的数据的条数 * */ var $table1= $('#table1').bootstrapTable({ columns: [ { field: 'sno',title: '学生编号',sortable:true },{ field: 'sname',title: '学生姓名' },{ field: 'ssex',title: '性别' },{ field: 'sbirthday',title: '生日' },{ field: 'class',title: '课程编号' },],url: '@Url.Action("GetStuList","DataOne")',pagination: true,sidePagination: 'server',pageList:[5,10,20,50],queryParams: function (params) { params.name = '张三丰'; //特别说明,返回的参数的值为空,则当前参数不会发送到服务器端 //这种指定请求参数的方式和datatables控价类似 params.sex = $('input[name="sex"]:checked').val(); return params; } }); //刷新方法 $('#heartBtn').click(function () { $table1.bootstrapTable('refresh'); }); [html] view plain copy print?

2.服务端代码处理

q.Ssex == sex); if (string.IsNullOrEmpty(search) == false) query = query.Where(q => q.Sno.Contains(search) || q.Sname.Contains(search)); //排序 if (sort == "sno") { if (order == "asc") query = query.OrderBy(q => q.Sno); else query = query.OrderByDescending(q => q.Sno); } else query = query.OrderBy(q => q.Sbirthday); int total = query.Count(); var list = query.Skip(offset).Take(limit).ToList(); return Json(new { rows = list,total = total }); }

以上所述是小编给大家介绍的Bootstrap Table使用整理(五)之分页组合查询。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持

原文链接:https://www.f2er.com/bootstrap/38739.html

猜你在找的Bootstrap相关文章