在一個包含了list的XML視圖里，使用SearchField標簽頁定義一個搜索按鈕。點擊之后，執行的事件處理函數為handleSearch：

<mvc:View controllerName="sapcp.cf.tutorial.app.controller.View1" xmlns:mvc="sap.ui.core.mvc" displayBlock="true" xmlns="sap.m"><Shell id="shell"><App id="app"><pages><Page id="page" title="{i18n>title}"><subHeader><Bar><contentLeft><SearchField search="handleSearch"/></contentLeft></Bar></subHeader><content><List id="List" items="{/Products}"><ObjectListItem type="Navigation" press="handleListItemPress" title="{ProductName}" number="{= ((${UnitPrice} * 100) / 100).toFixed(2) }"numberUnit="{i18n>currency}"><attributes><ObjectAttribute text="{QuantityPerUnit}"/></attributes><firstStatus><ObjectStatus text="{= ${Discontinued}? 'Discontinued' : 'Available' }" state="{= ${Discontinued}? 'Error' : 'Success' }"/></firstStatus></ObjectListItem></List></content></Page></pages></App></Shell> </mvc:View>

在視圖的控制器里實現這個搜索函數：

sap.ui.define(["sap/ui/core/mvc/Controller","sap/m/MessageBox" ], function (Controller, MessageBox) {"use strict";return Controller.extend("sapcp.cf.tutorial.app.controller.View1", {onInit: function () {},// show in a pop-up which list element was pressedhandleListItemPress: function (oEvent) {var oRouter = sap.ui.core.UIComponent.getRouterFor(this);var selectedProductId = oEvent.getSource().getBindingContext().getProperty("ProductID");oRouter.navTo("Detail", {productId: selectedProductId});}}); });

測試：

搜索能夠按照期望的工作：

要獲取更多Jerry的原創文章，請關注公眾號"汪子熙":

總結

以上是生活随笔為你收集整理的SAP UI5应用里搜索功能的实现的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。