list ajax封装,util-pagelist_基于layui封装的ajax分页列表
/**
* layui分頁列表模板引擎(使用時請使用new Pagelist(), 將每個分頁模板當成一個獨立的實例)
* @param tplid 模板id
* @param viewid 渲染模板容器的id
* @param pageid 分頁容器id
* @param httpurl 請求接口的url
* @param param 請求接口的參數
* @param method 接口請求方式(get、post)
*/
function Pagelist(tplid, viewid, pageid, httpurl, param, method) {
if (!method) {
method = "GET";
}
if (!param) {
param = {};
}
var _this = this;
this.page = 1;
this.limit = 10;
this.theme = '#0092fa';
this.paramType = 1; // 1: 'JSON', 2:JSON.stringify
this.renderPage = function (totalCount, currPage) {
laypage.render({
elem: pageid,
count: totalCount,
curr: currPage,
theme: _this.theme,
jump: function (obj, first) {
//首次不執行
if (!first) {
_this.page = obj.curr;
_this.limit = obj.limit;
// document.body.scrollTop = $('#' + viewid).offset().top - 100;
_this.request(obj.curr, obj.limit);
}
}
});
};
this.renderTpl = function (data) {
if (!data) {
data = [];
}
var getTpl = document.getElementById(tplid).innerHTML,
view = document.getElementById(viewid);
laytpl(getTpl).render(data, function (html) {
view.innerHTML = html;
});
};
this.request = function () {
document.getElementById(viewid).innerHTML = '
param['page'] = _this.page;
param['limit'] = _this.limit;
new ajaxRequest({
type: method,
url: httpurl,
data: _this.paramType === 1 ? param : JSON.stringify(param),
dataType: "json",
contentType: "application/json",
success: function (data) {
if (data.code === 0) {
_this.renderPage(data.total, data.pageNum);
_this.renderTpl(data.list);
} else {
_this.renderTpl([]);
}
},
error: function (jqXHR) {
_this.renderTpl([]);
}
});
};
this.init = function () {
_this.page = 1;
_this.request();
};
this.refresh = function () {
_this.request();
};
setTimeout(function () {
_this.init();
}, 0);
}
總結
以上是生活随笔為你收集整理的list ajax封装,util-pagelist_基于layui封装的ajax分页列表的全部內容，希望文章能夠幫你解決所遇到的問題。
- 上一篇： 中国大学moocpython笔记_中国大
- 下一篇： JAVA入门级教学之（while循环语句