关于x5翻页的问题

rockyPig

我的需求是这样的：初始页面加载10条数据信息，在list下边有一个按钮或者链接，显示“加载更多“，然后点击再加载10条数据，但是整个页面中不希望刷新，只是想让后加载的10条数据append到之前的10条数据后边。具体该怎么实现呢。

我只是使用x5开发手机app的前端。与后台交互都写完了，希望大家给点建议。谢谢

noidea001

用list组件设置limit=10就能实现啊

zhaixin

使用scrollView和list这两个组件就可以实现，看一下起步官网上体验和下载里面的视频
组件-scrollview、list、row.flv    详细介绍列表页的做法、以及数据组件加载数据和提交数据的方法

rockyPig

scrollView 这个组件我实验了一下，发现如果把scrollView单独放到一个contnet下是可以的，但是如果和其他的组件（比如row）一起放到一个content下就不可以，是不是我哪里操作有问题，请指教一下

zhaixin

scrollView里面放list，list里面放row，你是这样放的吗，如果不正确可以发一下w和js文件

huangwen702

这样的分页模式还是第一次加载的时候，拿到所有的满足条件的数据，有没有在服务端进行分页的示例或者代码？如果数据很多的话，这样的加载非常的慢的。

暗夜的忧伤

分页的话使用scrollView

然后再data的onCreate事件中设置limit
Model.prototype.taskCreate = function(event) {
                event.source.limit = 20;
        };

在onCustomRefresh事件中调用刷新的后台代码
传入相关参数,给你个参考（我用的是oracle的数据库）
// 加载任务信息
        Model.prototype.taskCustomRefresh = function(event) {
                this.loadTask({
                        "limit" : event.limit,
                        "offset" : event.offset
                });
        };

        Model.prototype.loadTask = function(event) {
                var data = this.comp("task");
                var params = {
                        "params" : {
                                "limit" : event.limit,
                                "offset" : event.offset
                        }
                }
                $.ajax({
                        "type" : "post",
                        "dataType" : "json",
                        "contentType" : "application/json",
                        "url" : "/news/taskQuery",
                        "data" : JSON.stringify(params),
                        "success" : function(json) {
                                var table = {
                                        "@type" : "table",
                                        "rows" : json.tasks
                                }
                                data.loadData(table);
                                data.first();
                        },
                        "error" : function() {
                                alert("加载错误");
                        }
                });
        }

zhaixin

从数据库一次取多少条数据，是由你写的取数据的方法决定，可以使用data组件的limit和offset来确定从几条记录开始取，取多少条记录

wjjs2008

暗夜的忧伤 发表于 2015-2-10 15:45
分页的话使用scrollView

然后再data的onCreate事件中设置limit

我用这个示例的方法读取到了第一页的数据，为什么继续下翻页的时候，taskCustomRefresh没有执行，offset一直是0.

wjjs2008

zhaixin 发表于 2015-2-12 10:16
从数据库一次取多少条数据，是由你写的取数据的方法决定，可以使用data组件的limit和offset来确定从几条记 ...

我用这个示例的方法读取到了第一页的数据，为什么继续下翻页的时候，taskCustomRefresh没有执行，offset一直是0，我现在是通过ajax从后台读取了一页的数据，想通过上下翻页分别读取上一页和下一页的数据。应该如何设置？