[ SAPUI5 ] Smart Filed with Value Help

○ 통화코드를 변경할 수 있게 리스트를 생성하고, 원하는 정보를 검색할 수 있는 검색 필드 만들기

    - [ SmartFieldWithValueHelp.view.xml ]

<mvc:View
	controllerName="sap.ui.demo.smartControls.SmartFieldWithValueHelp"
	xmlns="sap.m"
	xmlns:mvc="sap.ui.core.mvc"
	xmlns:smartForm="sap.ui.comp.smartform"
	xmlns:sap.ui.layout="sap.ui.layout"
	xmlns:smartField="sap.ui.comp.smartfield">
	<smartForm:SmartForm editable="true">
		<smartForm:layout>
			<smartForm:ColumnLayout 
				emptyCellsLarge="4"
				labelCellsLarge="4"
				columnsM="1"
				columnsL="1"
				columnsXL="1"/>
		</smartForm:layout>
		<smartForm:Group>
			<smartForm:GroupElement>
				<smartField:SmartField value="{Price}" id="idPrice"/>
			</smartForm:GroupElement>
		</smartForm:Group>
	</smartForm:SmartForm>
</mvc:View>

---

    - [ SmartField.controller.js ]

sap.ui.define([
	"sap/ui/core/mvc/Controller"
], function(Controller) {
	"use strict";

	return Controller.extend("sap.ui.demo.smartControls.SmartFieldWithValueHelp", {
		onInit: function() {
			this.getView().bindElement("/Products('4711')");
		}
	});

});

---

    - [ metadata.xml ]

<?xml version="1.0" encoding="utf-8"?>
<edmx:Edmx Version="1.0"
	...
    <edmx:DataServices m:DataServiceVersion="2.0">
    	<Schema Namespace="com.sap.wt02" 
			sap:schema-version="1" xmlns="http://schemas.microsoft.com/ado/2008/09/edm">
            	<EntityType Name="Product">
                	<Key>
                    	...
                <EntityType Name="Currency">
                    <Key>
                        <PropertyRef Name="CURR" />
                    </Key>
                    <Property Name="CURR" Type="Edm.String" MaxLength="4"
                        sap:display-format="UpperCase" sap:text="DESCR" sap:label="Currency Code"
                        sap:filterable="false" />
                    <Property Name="DESCR" Type="Edm.String" MaxLength="25"
                        sap:label="Description" />
                </EntityType>
                <EntityContainer m:IsDefaultEntityContainer="true"
                    sap:supported-formats="atom json">
                    <EntitySet Name="Products" EntityType="com.sap.wt02.Product" />
                    <EntitySet Name="Currency" EntityType="com.sap.wt02.Currency" />
                </EntityContainer>
                <Annotations Target="com.sap.wt02.Product/CurrencyCode"
                    xmlns="http://docs.oasis-open.org/odata/ns/edm">
                    <Annotation Term="com.sap.vocabularies.Common.v1.ValueList">
                        <Record>
                            <PropertyValue Property="Label" String="Currency" />
                            <PropertyValue Property="CollectionPath" String="Currency" />
                            <PropertyValue Property="SearchSupported" Bool="true" />
                            <PropertyValue Property="Parameters">
                                <Collection>
                                    <Record Type="com.sap.vocabularies.Common.v1.ValueListParameterOut">
                                        <PropertyValue Property="LocalDataProperty"
                                            PropertyPath="CurrencyCode" />
                                        <PropertyValue Property="ValueListProperty"
                                            String="CURR" />
                                    </Record>
                                    <Record
                                        Type="com.sap.vocabularies.Common.v1.ValueListParameterDisplayOnly">
                                        <PropertyValue Property="ValueListProperty"
                                            String="DESCR" />
                                    </Record>
                                </Collection>
                            </PropertyValue>
                        </Record>
                    </Annotation>
			</Annotations>
		</Schema>
	</edmx:DataServices>
</edmx:Edmx>

 

---

<EntityType Name="Currency" sap:content-version="1">
<Key>
		<PropertyRef Name="CURR" />
	</Key>
	<Property Name="CURR" Type="Edm.String" MaxLength="4" 
sap:display-format="UpperCase" sap:text="DESCR" 
sap:label="Currency Code" sap:filterable="false"/>
	<Property Name="DESCR" Type="Edm.String" MaxLength="25"	 sap:label="Description"/>
</EntityType>

 

      1) 'Filterable'을 'false'로 설정한다.

        * 'Filterable'은 기본 값이 'true'이므로 읽기 전용으로 바꾸기 위해서는 'false'를 직접 선언해줘야 한다.

      2) 왜냐하면 Currency Code 검색 필드가 있기 때문에 별도로 필요하지 않기 때문이다(?)

---

<Annotations Target="com.sap.wt02.Product/CurrencyCode"
				xmlns="http://docs.oasis-open.org/odata/ns/edm">
<Annotation Term="com.sap.vocabularies.Common.v1.ValueList">
	<Record>
		<PropertyValue Property="Label" String="Currency"/>
		<PropertyValue Property="CollectionPath" String="Currency"/>
		<PropertyValue Property="SearchSupported" Bool="true"/>
		<PropertyValue Property="Parameters">
			<Collection>
<Record Type="com.sap.vocabularies.Common.v1.ValueListParameterOut">
					<PropertyValue Property="LocalDataProperty" PropertyPath="CurrencyCode" />
					<PropertyValue Property="ValueListProperty" String="CURR" />
				</Record>
				<Record Type="com.sap.vocabularies.Common.v1.ValueListParameterDisplayOnly">
					<PropertyValue Property="ValueListProperty" String="DESCR" />
				</Record>
			</Collection>
		</PropertyValue>
	</Record>
</Annotation>
</Annotations>

 

      3) 'target'에는 'com.sap.wt02.product/currencyCode'를 사용한다.

        * 이로써 EntityType Product의 CurrencyCode가 이과 관련된 Valuelist 또는 ValueHelp가 있게 된다.

      4) 속성에 'SearchSupported'를  추가하고, 이에 대해 'true'로 설정함으로써 검색 필드를 노출시킨다.

---

---

 

Next Stage : [ SAPUI5 ] Smart Form

[ SAPUI5 ] Smart Form

반응형