Skip to Content
0
Dec 18, 2018 at 09:06 AM

Web Ide SAPUI5 use of match-code/dropdown list

319 Views

Hi Everyone,

I'm currently facing the following issue.

on my root view, I've got a dropdown list.

here is the xml of my view :

<mvc:View xmlns:html="http://www.w3.org/1999/xhtml" xmlns:mvc="sap.ui.core.mvc" xmlns="sap.m" xmlns:cd="http://schemas.sap.com/sapui5/extension/sap.ui.core.CustomData/1" controllerName="Oa_solaire_C13.Oa_solaire_C13.controller.Vue_accueil" displayBlock="true">
	<App id="idAppControl">
		<pages>
			<Page xmlns:action="http://schemas.sap.com/sapui5/extension/sap.ui.core.CustomData/1" title="{i18n>title}">
				<content>
				    <sap.ui.layout.form:Form xmlns:sap.ui.layout.form="sap.ui.layout.form" xmlns:action="http://schemas.sap.com/sapui5/extension/sap.ui.core.CustomData/1" editable="true" id="form0" validateFieldGroup="action" action:wiring="\{'validateFieldGroup':\{'navigation':\{'routeName':'View_form1'\}\}\}" width="400px">
				        <sap.ui.layout.form:formContainers>
				            <sap.ui.layout.form:FormContainer title="Choix du type de contrat à souscrire" id="container0">
				                <sap.ui.layout.form:formElements>
				                    <sap.ui.layout.form:FormElement label="Flux/Libellé" id="element0">
				                        <sap.ui.layout.form:fields>
				                            <Select xmlns="sap.m" id="select0" action:wiring="\{'validationSuccess':\{'navigation':\{'routeName':'View_form1'\}\}\}" validationSuccess="action" selectedKey="{TypeFlux}" items="{/ZisuRTypeFluxSet}">
				                                <items>
				                                    <core:Item xmlns:core="sap.ui.core" text="{TypeFlux}/{Designation}" id="item0" key="{TypeFlux}/{Designation}"/>
				                                    </items>
				                            </Select>
				                        </sap.ui.layout.form:fields>
				                    </sap.ui.layout.form:FormElement>
				                </sap.ui.layout.form:formElements>
				            </sap.ui.layout.form:FormContainer>
				        </sap.ui.layout.form:formContainers>
				        <sap.ui.layout.form:layout>
				            <sap.ui.layout.form:ResponsiveGridLayout id="layout0"/>
				        </sap.ui.layout.form:layout></sap.ui.layout.form:Form>
				    <Button xmlns="sap.m" text="Afficher le formulaire du flux sélectionné" id="button0" icon="sap-icon://accept" press="Open_form"/>
				</content>
			</Page>
		</pages>
	</App>
</mvc:View>

in the controler i'm retrieving the value chosen in the drop list in field {TypeFlux}/{Designation}

here is how I retrieve the data :

		Open_form: function (oEvent) {
			//This code was generated by the layout editor.
			var selectValue = this.getView().byId("select0").getSelectedKey();
			var selectFlux = selectValue.split("/");
			debugger;// eslint-disable-line
			// Now Get the Router Info
			var oRouter = sap.ui.core.UIComponent.getRouterFor(this);
			// Tell the Router to Navigate To Route_PODetail which is linked to V_PODetail view


			switch (selectFlux[0])
			{
			case "C13":
				oRouter.navTo("View_form1", {
					SelectedItem: selectFlux[1]
				});
				break;
			case "S17":
				// Get Property of the Clicked Item. i.e. PO number of the item which was clicked
				//var selectPO = oEvent.getSource().getBindingContext().getProperty("Description");
				oRouter.navTo("View_form2", { SelectedItem: selectFlux[1]});
				break;
			}
		}

As you can see i'm trying to navigate from the root view to 2 different views depending on the value chosen.

until this step everything works fine.

i'm using standard routes to go to either view :

			"routes": [{
				"name": "Vue_accueil",
				"pattern": "",
				"titleTarget": "",
				"greedy": false,
				"target": ["Vue_accueil"]
			}, {
				"name": "View_form1",
				"pattern": "PatternView1",
				"titleTarget": "",
				"greedy": false,
				"target": ["View_form1"]
			}, {
				"name": "View_form2",
				"pattern": "PatternView2{SelectedItem}",
				"titleTarget": "",
				"greedy": false,
				"target": ["View_form2"]
			}],
			"targets": {

as far as I know, even if my two views are much alike, i have to define different patterns for my code to work.

what I'm trying to do is to use selected designation and pass it by content to the next view.

for example first value in my droplist is C13/DESIGNATION1.

i'm using C13 value to choose my routing.

and I want corresponding designation to be the title of View_form1.

if second value is choosen, I want DESIGNATION2 to be the title of View_form2.

i'm using that to pass context :

oRouter.navTo("View_form1", { SelectedItem: selectFlux[1]});

but how to retrieve it in view 1 using routing ?

thanks in advance.

kind regards,

Jean-François.