流星的数据表,使用aldeed:tabular

问题描述 投票:0回答:2

我正在使用将数据从Web服务加载到数据表中。我有多个记录,现在我想添加按钮,该按钮将显示4行或所有行。我知道选项iDisplayLength,但是我不知道如何访问该变量。

这是我的数据表初始化的样子:

Places = new Mongo.Collection("places");
TabularTables = {};
Meteor.isClient && Template.registerHelper('TabularTables', TabularTables);

TabularTables.Places = new Tabular.Table({
    name: "LocationsList",
    collection: Places,
    columns: [
        {data: "naziv", title: "Name"},
        // {data: "status", title: "Status"},
        // {data: "bencinska", title: "Station"},
        {data: "razdalja", title: "Distance (km)"},
        {data: "", title: "",
            tmpl: Meteor.isClient && Template.btn_favorite,
            tmplContext: function(rowData) {
                return {
                    item: rowData,
                    column: ""
                };
            }
        }
    ],
    // aLengthMenu: [[3, -1], [3, "Vsi"]],
    iDisplayLength: -1,
    order: [[ 1, "asc" ]],
    limit: 30,
    responsive: true,
    autoWidth: false
});

这是我的模板:

<template name="table">
    {{> tabular table=TabularTables.Places class="table centered highlight compact" id="data_table"}}
</template>

[如果有人知道要加载表的良好模式(现在未显示任何数据,那么在未加载时,请给我一个建议。加载数据时和尚未加载时是否有标志?

编辑:

我已删除过滤器并从数据表中显示项目助手,因为我想通过更优雅的设计来解决此问题。

javascript meteor datatables
2个回答
0
投票

首先,如果在询问有关任何库的问题时提到要使用的库的版本,那可能是最好的。我假设您正在使用DataTables1.10.x。但是请注意,此版本的API有所更改,如果您使用的是v1.9或更早版本,则此信息可能不适用。

第二,选项仅用于初始化。因此,您无法使用iDisplayLength解决此问题。

Options

DataTables的大量选项可用于自定义方式它将向其展示其界面和可用功能最终用户。这是通过其配置选项完成的,它们是初始化时设置

也就是说,我无法编写代码来尝试这种操作,但是我认为您将需要使用page.len() method

注意,您可以向其传递-1以显示所有行,否则,传递的参数是您要显示的行数。


0
投票

从“流星/气象:表格”导入表格;从“ ../../../startup/lib/collection”中导入{Users};

   new Tabular.Table({
       name: "Users",
       collection: Users,
       responsive: true,
       autoWidth: true,
       order: [[0, "asc"]],
       columns: [
         {
            data:"profile.firstName",
            title:"First Name",
         },
         {
            data:"profile.lastName",
            title:"Last Name",
         },
         {
            data:"profile.country",
            title:"Country",
         },
         {
            data:"profile.state",
            title:"States",
         },
         {
            data:"profile.createdAt",
            title:"CreatedAt",
            render:function (val) {
                return moment(val).format('DD/MM/YYYY H:mm');
            },
         },
         {
             data:"profile.updatedAt",
             title:"UpdatedAt",
             render:function (val) {
                 return moment(val).format('DD/MM/YYYY H:mm');
             },
         },

     ],
      initComplete: function() {
          $('.dataTables_empty').html('processing');
      },
     processing: false

  });

{{> tabular table = TabularTables.Users class =“ table table-striped mybooks table-bordered table-condened”}}]

© www.soinside.com 2019 - 2024. All rights reserved.