SAP UI5應用裡的列表處理

i042416發表於2020-02-26

在XML view裡,使用List標籤引入列表:

SAP UI5應用裡的列表處理

<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}">
					<content>
						<List items="{/Products}">
							<StandardListItem type="Active" press="handleListItemPress" title="{ProductName}"/>
						</List>
					</content>
				</Page>
			</pages>
		</App>
	</Shell>
</mvc:View>

上面程式碼裡註冊的列表元素點選處理函式handleListItemPress,實現在控制器檔案裡:

SAP UI5應用裡的列表處理


```JavaScript

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 pressed
		handleListItemPress: function (oEvent) {
			MessageBox.show(
				"You pressed item: " + oEvent.getSource().getBindingContext(), {
					icon: sap.m.MessageBox.Icon.INFORMATION,
					title: "It works!",
					actions: [sap.m.MessageBox.Action.OK]
				}
			);
		}
	});
});

```

執行效果:點選列表元素:

SAP UI5應用裡的列表處理

彈出對話方塊:

SAP UI5應用裡的列表處理


來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/24475491/viewspace-2677216/,如需轉載,請註明出處,否則將追究法律責任。

相關文章