MiniUI前台分页,假分页实现源码-创新互联-成都创新互联网站建设

关于创新互联

多方位宣传企业产品与服务 突出企业形象

公司简介 公司的服务 荣誉资质 新闻动态 联系我们

MiniUI前台分页,假分页实现源码-创新互联

背景

创新互联-专业网站定制、快速模板网站建设、高性价比容县网站开发、企业建站全套包干低至880元,成熟完善的模板库,直接使用。一站式容县网站制作公司更省心,省钱,快速模板网站建设找我们,业务覆盖容县地区。费用合理售后完善,10多年实体公司更值得信赖。

对于数据较少,无需后台分页的需求,可使用以下解决方案

方案

MiniUI提供了监听事件,特别方便即可实现。

源码

mini.parse();
var grid = mini.get("datagridTable");
        // 获取所有数据和总记录数 { total: 100, data: [...] }
        var dataResult = {};
        dataResult.total = ret.length;
        dataResult.data = ret;
        // 监听分页前事件,阻止后自行设置当前数据和分页信息
        grid.on("beforeload", function (e) {
            e.cancel = true;
            var pageIndex = e.data.pageIndex, pageSize = e.data.pageSize;
            fillData(pageIndex, pageSize, dataResult, grid);
        });
        // 第一次设置
        fillData(0, grid.getPageSize(), dataResult, grid);
        
// 分页填充细节处理
function fillData(pageIndex, pageSize, dataResult, grid) {
    
    var data = dataResult.data, totalCount = dataResult.total;

    var arr = [];
    var start = pageIndex * pageSize, end = start + pageSize;
    for (var i = start, l = end; i < l; i++) {
        var record = data[i];
        if (!record) continue;
        arr.push(record);
    }
    

    grid.setTotalCount(totalCount);
    grid.setPageIndex(pageIndex);
    grid.setPageSize(pageSize);

    grid.setData(arr);
}

结束

以上代码,填充后台数组json即可完成前台分页。

另外有需要云服务器可以了解下创新互联scvps.cn,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。


分享题目:MiniUI前台分页,假分页实现源码-创新互联
URL网址:http://kswsj.cn/article/cosohg.html

其他资讯