简单的智能过滤条示例

时间:2017-02-24 09:49:40

标签: sapui5

我正在尝试在智能桌面上实现智能过滤器栏。我的智能表包含一个简单的表,它具有来自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>

但是,某种程度上我的智能过滤器无效。我google了很多但找不到解决方案。有人可以告诉我什么是错的,或者可以分享如何正确实施智能过滤器的任何示例吗?

提前感谢:)

1 个答案:

答案 0 :(得分:2)

使用SmartTable而不是常规Table时,请为SmartFilterBar指定一个ID,然后将属性smartFilterId设置为等于SmartFilterBar的ID。然后自动进行搜索和过滤。

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

或者,如果您使用常规Table,就像您提供的代码一样,您必须使用控制器来获取过滤器并使用它们来过滤表格的绑定。您需要先将表绑定到一个实体集(如果您正在使用它,则绑定到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);
}