简单的智能过滤器栏示例

Question

我正在尝试在智能表顶部实现智能过滤器栏。我的智能表包含一个简单的表，该表具有从Formatter.js

中计算出的字段

<smartFilterBar:SmartFilterBar id="smartFilterBar" entitySet="/abc">
    <smartFilterBar:controlConfiguration>
        <smartFilterBar:ControlConfiguration key="Order" label="ProdOrder">
            <smartFilterBar:customControl>
                <Input id="Order" placeholder="Order"/>
            </smartFilterBar:customControl>
        </smartFilterBar:ControlConfiguration>
    </smartFilterBar:controlConfiguration>
</smartFilterBar:SmartFilterBar>
<smartTable:SmartTable id="smartTable_ResponsiveTable" smartFilterId="smartFilterBar" tableType="ResponsiveTable" entitySet="abc"
    enableAutoBinding="true" showRowCount="true">
    <smartTable:customData>
        <core:CustomData key="p13nDialogSettings" value='{filter:{visible:false}}'></core:CustomData>
    </smartTable:customData>
    <Table id="table" width="auto" class="sapUiResponsiveMargin">
        <columns>
            <Column id="idColumnOrder" customData:p13nData='{"leadingProperty":["ManuOrder"]}'>
                <Text text="{i18n>order}" id="order" tooltip="{i18n>order}"/>
            </Column>
        </columns>
        <items>
            <ColumnListItem>
                <cells>
                    <ObjectIdentifier class="sapUiTinyMarginTopBottom" title="{ManuOrder}"/>
                </cells>
            </ColumnListItem>
        </items>
    </Table>
</smartTable:SmartTable>

但是，我的智能过滤器不起作用。我谷歌搜索了很多，但找不到解决方案。有人可以告诉我怎么了，或者可以分享如何正确实现智能过滤器的任何示例？

预先感谢：）

Answer 1

使用SmartTable而不是常规表时，为SmartFilterBar分配ID，然后将属性smartFilterId设置为等于SmartFilterBar的ID。然后搜索和过滤会自动发生。

<smartFilterBar:SmartFilterBar id="smartFilterBar"...>
...
</smartFilterBar:SmartFilterBar>
<smartTable:SmartTable smartFilterId="smartFilterBar"...>
...
</smartTable:SmartTable>

或，如果您使用提供的代码（如所提供的代码），则必须使用控制器来获取过滤器并使用它们来过滤表的绑定。您需要先将表绑定到实体集（如果您正在使用的话，或者在JSON模型中的属性），并为SmartFilterBar的搜索事件添加事件处理程序。

在您的视图中：

<smartFilterBar:SmartFilterBar id="smartFilterBar" search="onSearch"...>
...
</smartFilterBar:SmartFilterBar>
<Table id="table" items="{/entitySetName}"...>
...
</Table>

在您的控制器中：

onSearch: function() {
    var aFilters = this.getView().byId("smartFilterBar").getFilters();
    this.getView().byId("table").getBinding("items").filter(aFilters);
}