Hello everyone,

This is my first blog,

In it, I am about to explain How to pass the parameter to function in the controller from XML view in SAP UI5. I hope my blog will help.

most of the time we write separate (multiple) functions for performing actions based on how and where we are triggering the object or action. in simple words, we are passing the parameters to the function at the time function call.

let’s create a scenario for it suppose we have two buttons one is Save as Draft and the second is Submit.

suppose on Save as draft we are sending the API call with Record id 1 and on Submit we are sending it with 0.

for these, we usually write two functions and write the other logic in the same manner.

but with the help of passing parameters to a function we can achieve it with a single function.

let’s get started.

1. Introduction

Before starting let me explain why and in which case we can use these pass parameters from XML method. –

• To reduce the number of calls to internal functions which helps to achieve different conditions. 
• function functionality is dependent upon a particular parameter.
• We can you this in functions in which logic is the same but depends on parameters conditions are changing and functionality is the same.

2. Prerequisite

• SAP UI5 version 1.56 and above.
• https://sapui5.hana.ondemand.com/#/controls

3. Controller Code

In the controller, we write the function logic and conditions required to perform the action as per the event triggered.

Here is one of the functions which perform the action required as per condition or parameter.

	onPressFun: function (oEvent, SecondPara, sActionValue) {
			var BtnEvent = oEvent.getSource();
			var SecondParameter = SecondPara;
			if (SecondParameter === "1") {
				sap.m.MessageBox.information(sActionValue);
			} else if (SecondParameter === "0") {
				sap.m.MessageBox.information(sActionValue);
			} else {
				sap.m.MessageBox.information("Wrong data Button event triggered");
			}
		}

4. XML Code

From the XML View function, we need to pass the parameter where we are calling the function like mentioned in below XML code.

with the help of parameter in function call we can avoid multiple functions which have the same logic but depends upon a different parameter.

See the code below:

<mvc:View controllerName="com.tc.xmlparameter.XMLParameter.controller.Worklist" xmlns="sap.m" xmlns:mvc="sap.ui.core.mvc"
	xmlns:semantic="sap.f.semantic">
	<semantic:SemanticPage >
		<semantic:content >
			<VBox class="sapUiLargeMargin">
				<HBox class="sapUiLargeMargin">
					<Button class="sapUiLargeMargin" text="Save as Draft" press="onPressFun($event ,'1','Saved')"/>
					<Button class="sapUiLargeMargin" text="Submit" press="onPressFun($event ,'0','Submitted')"/>
				</HBox>
			</VBox>
		</semantic:content>
	</semantic:SemanticPage>
</mvc:View>

• $event is passed as an event that triggers upon the button being clicked(oEvent).
• ‘ ‘ (single quotes) help to pass the parameter value as required.
• we can pass multiple parameters at a single time.

as you can see that we write the same function but can trigger a different condition which depends upon the parameter every time. it reduces internal function calls and helps to achieve code optimization.

passing parameters from a function can reduce the ‘n’ numbers of the internal function call.

5. Output

below I attaching the ScreenShot of the output.

First SS- when we press the save as draft button.

Second SS – when we press submit button.

Img for Save as Draft save

Image for Submit

6. Conclusion

From the above scenario, we learn how to pass the parameters to the function from the XML view in SAP UI5. in this we can add multiple parameters for multiple conditions, and with the help of the event we can also trigger the event handler.

It’s not that complex but very useful. I use it in some of my projects which helps me a lot to optimize my code and hope it can help others too.

If you are stuck between any topic feel free to ask and suggest to me to improve.

please share your feedback or thoughts in a comment.

Thank you, everyone, Happy learning!!!

Regards,

Shubham C