在 aldded tabular table 下拉列表更改事件中绑定数据
Bind data in aldded tabular table on dropdown change event
我正在使用 aldeed tabular table 来显示记录。我已提交状态下拉列表。我想根据下拉选择过滤记录。
有什么办法吗?
在模板中为表格组件使用 selector
参数以仅过滤客户端的值。
类似于:
<template name="invoiceList">
<div>
{{> tabular table=TabularTables.Invoices selector=statusSelector class="table table-bordered table-striped table-hover"}}
</div>
</template>
statusSelector
是一个模板助手,它应该 return 一个 Mongo-style 选择器。该选择器可以从会话变量构造。将会话变量设置为下拉选择的值
并在模板助手中获取值。
例如:
Template.invoiceList.events( {
'change #statusdropdown': function(evt) {
var currentTarget = evt.currentTarget;
var statusValue = currentTarget.options[currentTarget.selectedIndex].value;
Session.set('selectedstatus', statusValue);
}
});
Template.invoiceList.helpers({
statusSelector: function () {
var selector = {};
var selectedStatus = Session.get('selectedstatus');
if (selectedStatus)
selector = {status: selectedStatus}; // This is the selector/filter that is going to be applied to the collection.
return selector;
}
});
这里也有说明:https://github.com/aldeed/meteor-tabular#displaying-only-part-of-a-collections-data-set
我正在使用 aldeed tabular table 来显示记录。我已提交状态下拉列表。我想根据下拉选择过滤记录。
有什么办法吗?
在模板中为表格组件使用 selector
参数以仅过滤客户端的值。
类似于:
<template name="invoiceList">
<div>
{{> tabular table=TabularTables.Invoices selector=statusSelector class="table table-bordered table-striped table-hover"}}
</div>
</template>
statusSelector
是一个模板助手,它应该 return 一个 Mongo-style 选择器。该选择器可以从会话变量构造。将会话变量设置为下拉选择的值
并在模板助手中获取值。
例如:
Template.invoiceList.events( {
'change #statusdropdown': function(evt) {
var currentTarget = evt.currentTarget;
var statusValue = currentTarget.options[currentTarget.selectedIndex].value;
Session.set('selectedstatus', statusValue);
}
});
Template.invoiceList.helpers({
statusSelector: function () {
var selector = {};
var selectedStatus = Session.get('selectedstatus');
if (selectedStatus)
selector = {status: selectedStatus}; // This is the selector/filter that is going to be applied to the collection.
return selector;
}
});
这里也有说明:https://github.com/aldeed/meteor-tabular#displaying-only-part-of-a-collections-data-set