未分类

Vue.js实现分页查询功能_vue.js_脚本之家

25 3月 , 2020  

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

 public JsonResult GetAllpage { TextEntities tes = new TextEntities(); int allcount = tes.Users.Count(); //总页数 int allpage = allcount / rows; if  allpage = allpage + 1; return Json; }
 public JsonResult GrtUserData { //top分页法 row_number分页 TextEntities tes = new TextEntities(); //分页查询 List ulist = tes.Users.OrderBy.Skip.Take; int allcount = tes.Users.Count(); //总页数 int allpage = allcount / rows; if  allpage = allpage + 1; DTO_Page dp = new DTO_Page(); dp.data = ulist; dp.allpage = allpage; return Json(dp, JsonRequestBehavior.AllowGet); }

public class DTO_Page { public int rows { get; set; } public int allpage { get; set; } public List data { get; set; } }
 //封装一个查询后台的方法 var getdata = function  { $.ajax({ url: '/home/GrtUserData', type: 'get', data: { page: page, rows: rows }, success: function  { vm.mydata = dto_page.data; $.jqPaginator('#pagination1', { totalPages: dto_page.allpage, visiblePages: 5, currentPage: page, onPageChange: function  { //怎么把第一次忽略 if  { //更新查询后的页面 getdata; } }); } $ { //给更新div添加数据 var update_vm = new Vue({ el: "#updatecontent", data: { userinfo: {} } }) //实例化 vue.js  只实例化一次 var vm = new Vue({ el: '#content', data: { mydata: [] }, methods: { butdelete: function  //删除 { $.post('/home/BatchDelete', { ids: _id }, function  { if  { location.href = "/home/UserMan"; } else { alert; }, butupdate: function  //更新 { //使用jquery打开编辑状态 //$.parent.find.each { // $.html("<input type='text' style='width:50px' value=" + $; //}); //复制对象 // var databack = $.extend; update_vm.$data.userinfo = item; layer.open({ type: 1, area: ["300px", "230px"], title: "更新", content: $, btn: ["保存"], yes: function  { $.post('/home/Update', update_vm.$data.userinfo, function  { //可以把vue.js数据替换把更新后到页面 // vm.$data.mydata.splice(1, 1, update_vm.$data.userinfo); }); }, cancel: function () //点击关闭按钮 { // alert; // console.log; } } }); //默认第一个请求 getdata; $.click { //存放需要批量删除的id var ids = ""; $(".mytable input[type='checkbox']:checked").each(function  { ids += $; $.post('/home/BatchDelete', { ids: ids }, function  { if  { location.href = "/home/UserMan"; } else { alert;

本文实例为大家分享了Vue.js实现分页查询的具体代码,供大家参考,具体内容如下

关于vue.js的学习教程,请大家点击专题vue.js组件学习教程、Vue.js前端组件学习教程进行学习。

www6766com ,vue.js的使用如下:

b、分页条js、css

5、前台分页方法,获取后台的数据,实现分页的动态性

4、定义获取总页数的方法


相关文章

发表评论

电子邮件地址不会被公开。 必填项已用*标注

网站地图xml地图