SAP UI5 SearchField怎么在表里绑定
时间: 2024-05-05 08:15:51 浏览: 16
要在表中绑定SAP UI5 SearchField,您需要按照以下步骤操作:
1. 在XML视图中定义表格和SearchField。
```xml
<Table id="table" items="{/items}">
<columns>
<Column>
<Text text="Name" />
</Column>
<Column>
<Text text="Age" />
</Column>
</columns>
<items>
<ColumnListItem>
<cells>
<Text text="{Name}" />
<Text text="{Age}" />
</cells>
</ColumnListItem>
</items>
</Table>
<SearchField id="search" search="onSearch" />
```
2. 在控制器中获取SearchField和表格。
```javascript
onInit: function() {
var oTable = this.getView().byId("table");
var oSearch = this.getView().byId("search");
}
```
3. 创建一个过滤器并将其应用于表格。
```javascript
onSearch: function(oEvent) {
var sQuery = oEvent.getParameter("query");
var oTable = this.getView().byId("table");
var oItemsBinding = oTable.getBinding("items");
var oFilter = new sap.ui.model.Filter("Name", sap.ui.model.FilterOperator.Contains, sQuery);
oItemsBinding.filter([oFilter]);
}
```
这将在表格中过滤出包含搜索查询的数据。您可以根据需要更改过滤器的属性和运算符。
相关推荐
![docx](https://img-home.csdnimg.cn/images/20210720083331.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)
![](https://csdnimg.cn/download_wenku/file_type_ask_c1.png)