如何根据分页找到id

Question

我在JSF <h:dataTable>上使用jQuery DataTables plugin。在这个页面中我有86条记录。

+++++++++++++++++++++++++++++++++++++
+ id  +    Name    +   Email        +
+++++++++++++++++++++++++++++++++++++
+  1  +   Name 1   +  Email 1       +
+  2  +   Name 2   +  Email 2       +
+  3  +   Name 3   +  Email 3       +
+........
+  4  +   Name 4   +  Email 4       +
+++++++++++++++++++++++++++++++++++++
+                 1.2.3.4..... Next +
+++++++++++++++++++++++++++++++++++++

注意：每个表我显示10条记录。

我的客户想要的是添加一个列视图，其工作方式如下。

当我打开桌子时，我有10条记录，意味着id 1-10获得1个视图。

当我点击分页2时，id 11-20获得1个视图。

知道如何完成这项工作吗？

---

编辑1

get 1 view的含义如下：

用户A：打开页面时，默认分页1为ON。所以在页面上我们有10条记录。表示用户A查看所有10条记录，表示每条id获得1个视图。所以现在id 1-10有1个视图。用户A退出页面。

用户B：打开页面时，默认分页1为ON。所以在页面上我们有10条记录。表示用户B查看所有10条记录，表示每条id获得1个视图。所以现在id 1-10有2个视图（因为用户A已经查看过）。现在用户B点击分页2按钮。所以id 11-20获取视图1.用户B退出页面。

这样我想计算每个id的视图。

基本上我想要的是

• 按下分页按钮时，我想获取桌面上的ID。
• 将这些ID传递给某个bean并增加这些id的视图。

知道如何完成这项工作吗？

---

编辑2

同时检查此

https://stackoverflow.com/a/16934279/1066828

我找到了所有解决方案......

Answer 1

在研究了jQuery DataTables的分页后，发现了很多很棒的东西，例如这个家伙Todd。 A. Wood在分页here时使用PetaPoco加载数据做得很好。但即使将它与您的要求进行比较，它也很复杂。我必须承认DataTables有很棒的文档，我找到了答案pagination plugin。

所以神奇的功能是：fnPagingInfo。但是，要获取页面信息，必须通过fnDrawCallback捕获数据表呈现（或重新呈现）事件。

无论如何你应该嵌入以下代码：

<script type="text/javascript">
    $.fn.dataTableExt.oApi.fnPagingInfo = function ( oSettings )
    {
        return {
            "iStart":         oSettings._iDisplayStart,
            "iEnd":           oSettings.fnDisplayEnd(),
            "iLength":        oSettings._iDisplayLength,
            "iTotal":         oSettings.fnRecordsTotal(),
            "iFilteredTotal": oSettings.fnRecordsDisplay(),
            "iPage":          oSettings._iDisplayLength === -1 ?
                    0 : Math.ceil( oSettings._iDisplayStart / oSettings._iDisplayLength ),
            "iTotalPages":    oSettings._iDisplayLength === -1 ?
                    0 : Math.ceil( oSettings.fnRecordsDisplay() / oSettings._iDisplayLength )
        };
    };

    $(document).ready(function() {
        $('#example').dataTable( {
            "fnDrawCallback": function () {
                var input = document.getElementById('form:Fenerbahce');
                input.value = this.fnPagingInfo().iPage;
            }
        } );
    });

</script>

可以看出，第一部分意味着fnPagingInfo的定义。在第二部分fnDrawCallback捕获render事件，我们将输入的值设为：

<h:form>
    <h:inputText id="Fenerbahce" value="#{bean.var1}" style="display:none;"></h:inputText>
</h:form>

那么到目前为止我们得到了什么？

我们获得了用户点击的页码信息，并将此号码放入bean。其余部分存储每个页面的编号，并在有人点击时将它们计算在一个数组中：

public void setVar1(String var1) {
    this.var1 = var1;
    Array[var1]++;
}

注意：我通过基本的HTML表格尝试了这个：

<table id="example">
    <thead>
    <tr>
        <th>Column 1</th>
        <th>Column 2</th>
        <th>etc</th>
    </tr>
    </thead>
    <tbody>
    <tr>
        <td>Row 1 Data 1</td>
        <td>Row 1 Data 2</td>
        <td>etc</td>
    </tr>
    <tr>
        <td>Row 2 Data 1</td>
        <td>Row 2 Data 2</td>
        <td>etc</td>
    </tr>
    </tbody>
</table>

当然有很多行。