数据表未显示最后一行

Posted

技术标签:

【中文标题】数据表未显示最后一行【英文标题】:Datatables not showing last row 【发布时间】:2014-02-02 17:16:28 【问题描述】:

我正在使用 jQuery 数据表插件来显示一个表格,但无论我有多少行,最后一行都不会显示。使用"bInfo": true,它在底部显示“显示 11 个条目中的 1 到 10 个”,因此它清楚地知道还有另一行。我尝试启用分页,但是当下一个箭头全部亮起时,点击它什么也没做。

我 99% 确定问题与最后一行中的项目无关,因为当我添加一个名称以“Z”开头的新项目时,它成为了缺失的项目(他们'按字母顺序排列)

这是我的数据表初始化:

dataTable(
            "bPaginate": false,
            "bProcessing": true,
            "bServerSide": true,
            "bDeferRender": true,
            "bSort": true,
            "aoColumnDefs": [
                              'bSortable': false, 'aTargets': ["_all"] ,
                              'sDefaultContent': "N/A", 'aTargets': [0,1,4,5,6,7] ,
                              'sDefaultContent': 0, 'aTargets': [2,3,8,9,10] 
                         ],
            "bInfo":true,
            "sAjaxSource": Django.url('dash:testsets_header', testSetId),
            "bFilter": false,

            "oLanguage": 
                "sProcessing": '<i class="icon-spinner icon-spin"></i> Loading...',
                "sZeroRecords": "No Test Set loaded."
            ,

            "aoColumns": [
             //Various column definitions
            ]
        );

知道为什么最后一行不显示吗?

【问题讨论】:

再摆弄一下,看起来如果我启用分页,我可以将它设置为在一页上显示所有内容,但如果我禁用了分页,并且我不想分页,则不能。 1.看着你的其他cmets,我有点困惑。你的数据库中有 11 个元素吗?您是发送 11 个对象还是仅发送 10 个? 2. 你能告诉我你的看法吗?你是如何创建 json、数据等的。 @yuvi 数据库中有 11 个元素,只有 10 个元素通过 JSON 响应发送。数据表清楚地知道有 11 个,因为它在底部显示“显示 11 个条目中的 1 到 10 个”。有问题的视图是一个简单的 DatatablesView。我觉得问题一定出在 JS 中(或者可能是数据表插件的错误),因为如果我启用分页并将 iDisplayLength 手动设置为 11 或更高,我可以显示所有 11 个条目。 您使用的是什么 django 版本?另外,你想让我告诉你如何手动使用 django 和 dataTables 吗? (我将补充一点,这是我将两者整合的首选方式) 抱歉,我正忙于其他事情。我的解释有点笼统,与您的问题没有具体关系(因为我真的无法判断您遇到了什么问题,但对您的服务器端代码一无所知),但我希望它对您有所帮助 【参考方案1】:

由于您没有共享自己的代码,并且您提到使用 eztables,我想我会写一篇关于如何手动集成 django 和 dataTables 的快速教程。这需要多做一些工作,但我认为灵活性确实有回报,让您准确定义要使用的内容和不使用的内容。

全面披露:我讨厌笼统的观点。作为扩展,我也讨厌 eztables 和所有用于 django 的自动集成工具,它们会阻止你真正学习如何自己做某事。这只是我的意见。话虽如此,将 django 与 dataTables 集成并不是很复杂。只是 dataTables 发送了一个非常具体的 XHR 请求,您需要相应地处理它。以下是here 提供的代码的粗略翻译。此外,从 Django 1.5 开始,simplejson 已被弃用,我将向您展示如何使用 json。

在我的例子中,我创建了一个名为 Item 的模型,它只有两个字段 - 姓名和电子邮件。这只是我很久以前创建的一个虚拟模型,我发送垃圾邮件进行测试。然后我编写了这个用于处理数据表的基本代码。请注意,客户端代码在另一个视图上(不是返回 dataTables XHR 请求的视图)。

这里是代码,之后我会复习重点。

客户端:

<table id="example" class="table">
    <thead>
        <tr>
            <th>Name</th>
            <th>Email</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td colspan="2" class="dataTables_empty">Loading data from server</td>
        </tr>
    </tbody>
</table>

<script type="text/javascript">
$(document).ready( function () 
  $('#example').dataTable( 
    "bServerSide": true,
    "sAjaxSource": "/datatables_view/"
   );
 );
</script>

服务器端:

import json
from cStringIO import StringIO

def datatables_view(request):
    items = Item.objects.all()

    # count total items:
    total = items.count()

    #filter
    search = request.GET['sSearch']
    qs = Q(name__contains=search) | Q(email__contains=search)
    itemes = items.filter(qs)


    # ... etc., all other filtering done here...


    # count items after filtering:
    total_filtered = items.count()


    # slice according to length sent by dataTables:
    start = int(request.GET['iDisplayStart'])
    length = int(request.GET['iDisplayLength'])
    items = items[start:(start+length)]

    response = 
        'aaData': [ [i.name, i.email] 
                        for i in items],
        'iTotalRecords': total,
        'iTotalDisplayRecords': total_filtered,
        'sEcho': request.GET['sEcho']
    

    s = StringIO()
    json.dump(response, s)
    s.seek(0)
    return HttpResponse(s.read())

这可能看起来很可怕,但它不应该。让我们分解一下(我只会介绍基础知识,您将从这里开始学习):

    正如我所提到的,dataTables 发送一个非常具体的 XHR 请求。所以我们所做的就是以 JSON 格式返回预期的响应。您可以看到正在发送的参数列表,预计将返回here。您也可以消耗它们并来回发送自己的东西,但现在让我们忽略它。 所以首先需要以json的形式返回数据。我喜欢使用 StringIO(或者更确切地说是更快的 cStringIO),因为当我最初使用 json.dumps 时,它会出现各种疯狂的错误,我只是对它感到恼火。使用 StringIO 我从来没有遇到过问题,所以从那以后这是我的正常方法(尽管显然不是唯一的方法,甚至可能不是最好的方法)。 始终返回 sEcho,它只是数据表的安全机制 iTotalRecords 和 iTotalDisplayRecords 是不言自明的,它们只是返回总数和过滤后的总数(注意它在切片之前) 您使用 iDisplayStart 和 iDisplayLength 来计算您将显示多少值 aaData 是您发送的实际数据的二维矩阵。每个列表的长度应与空填充器 td &lt;td colspan="2" class="dataTables_empty"&gt; 的 colspan 长度相同。在这种情况下,只是姓名和电子邮件,但您显然可以随意使用它 sSearch 是数据表顶部的实时搜索输入。您可以使用它来定义如何过滤(我只是将__contains 用于两个字段,但您可以扩展它并创建自己的逻辑,这很有用) 上面的示例没有显示任何列排序的痕迹。我会让你自己弄清楚(不是很复杂,here's that link again 我给你了。去看看吧,看看所有发送到服务器的参数以及它们代表什么)。 请记住,从现在开始,任何其他实现都由您自己完成,您将不会拥有任何自动运行的功能。您必须自己配置每个功能。

就像我之前说的,这似乎需要大量的工作,但事实并非如此,而且灵活性确实得到了回报。祝你好运!希望对您有所帮助 =]

更新

确实缺乏手动集成的一般示例。我花时间在这里写了一个 django-sn-p:https://djangosnippets.org/snippets/3019/。它以非常简化的格式包含所有常见的数据表实现(包括排序等),包括一些管理员风格的预定义(我认为这很好)。

【讨论】:

非常感谢!我等着接受,直到我真正确定这对我有用,但数据表现在看起来不错。 很高兴有帮助 =]【参考方案2】:

您需要设置"bPaginate" : false,因为它默认设置为true。

【讨论】:

对不起,我发布了代码,因为我正在摆弄它以尝试使其工作。我可以在打开分页的情况下在一页中获取所有条目(虽然不是默认情况下,但似乎,除非我只是硬编码一个我知道将超过行数的值,因为"iDisplayLength":-1 似乎不是按应有的方式工作)。当我设置 "bPaginate" : false 时,我仍然只得到 n 行中的前 n-1 个 完全移除 iDisplayLength 然后将 bPaginate 设置为 false。 奇怪,我刚刚查看了我使用的数据表设置,它应该可以正常工作。你能发布你的 JSON,也许问题就在那里。 喜欢这个? sEcho:1 iColumns:11 sColumns: iDisplayStart:0 iDisplayLength:-1 mDataProp_0:name mDataProp_1:notes mDataProp_2:requests mDataProp_3:trips mDataProp_4:earliest_pickup mDataProp_5:latest_pickup mDataProp_6:earliest_dropoff mDataProp_7:latest_dropoff mDataProp_8:passengers mDataProp_9:average_distance mDataProp_10:average_duration iSortCol_0:0 sSortDir_0:asc iSortingCols:1 bSortable_0:false bSortable_1:false bSortable_2:false bSortable_3:false bSortable_4:false bSortable_5:false bSortable_6:false bSortable_7:false bSortable_8:false bSortable_9:false bSortable_10:false _:1389715731159 你使用它的方式和我不同。我处理我的数据服务器端,并且一次只将 JSON 对象中的所有行传回数据表。您仍然在此对象中设置了 iDisplayLength。我构建了一个 aaData JSON 对象服务器端并通过 AJAX 将其传递给单击函数。它不包含除数据之外的任何内容。我的 JSON 看起来像这样:"aaData":["columnname":"columndata","columnname2":columndata2"]

以上是关于数据表未显示最后一行的主要内容,如果未能解决你的问题,请参考以下文章

WPF编程:textbox控件文本框数据显示最后一行

在TextBrowser显示中,如何让最新的数据永远出现在第一行或者是在窗口的最后显示信息

VB.net怎么添加数据至ACCESS数据库中,并显示在DataGridview控件的第一行(注意:不是最后一行)。

C# DataGridView 数据显示到最后一行后,如何使滚动条继续向下滚动。

Oracle查询当前某条数据的前一行数据与后一行数据!.......解决问题悬赏20分

向显示幅度的数据帧添加一行(正值或负值之和的最大值)