sapui5 input focus out event is stopping the button press event

[former_member184367]

Hi Team,

In the SAPUI5 application, there are 4 inputs available to user for searching the order data. User will enter the order number in 1st input field, on foucsout event of 1st input field- the OData call is made to backend to fetch the plant data and show the plant in 2nd input field. Then user can press Tab key or use mouse to navigate to 3rd input and enter the storage location, on focus out event of 3rd input field- the OData call is made to backend to fetch the Warehouse data and show the plant in 4th input field.

When user uses mouse to navigate to search button and presses the button, the focus out event of 3rd input is getting called but the press event of button is not getting called at all. However if user uses Tab key to navigate to search button from input3 and then presses the search button, then the press event of button gets called.

Could you please help me figuring out the solution why the button press event is not getting called.

XML view Code:

<FlexBox direction="Column" fitContainer="true" height="auto"
	class="appView-FlexBox-Border sapUiSmallMarginBeginEnd sapUiSmallMarginTopBottom">
    <FlexBox fitContainer="true" width="100%" class="appView-FlexBox-Border-Bottom">
        <FlexBox direction="Column" fitContainer="true" width="100%" class="appView-Search-FlexBox1">
            <HBox class="appView-Search-FlexBox-HBox" width="100%">
                <Label text="{i18n>OrderLabel}" width="100%" textAlign="Right"/>
                <Input id="orderLabel" width="100%"></Input>
            </HBox>
            <HBox class="appView-Search-FlexBox-HBox" width="100%">
                <Label text="{i18n>plantLabel}" width="100%" textAlign="Right"/>
                <Input width="100%" enabled="false" value="{localDataModel>/plantDetails/0/EvWerks}"/>
            </HBox>
        </FlexBox>
        <FlexBox direction="Column" fitContainer="true" width="100%" class="appView-Search-FlexBox1">
            <HBox class="appView-Search-FlexBox-HBox" width="100%">
                <Label text="{i18n>StorageLocationLabel}" width="100%" textAlign="Right"/>
                <Input id="storageLocationLabel" width="100%" type="Text"></Input>
            </HBox>
            <HBox class="appView-Search-FlexBox-HBox" width="100%">
                <Label text="{i18n>warehouseNumberLabel}" width="100%" textAlign="Right"/>
                <Input width="100%" enabled="false" value="{localDataModel>/wareHouseDetails/EvWhouse}"/>
            </HBox>
        </FlexBox>
        <FlexBox direction="Column" fitContainer="true" alignItems="Center" justifyContent="Center" width="100%">
            <Button id="idSearchButton" text="{i18n>searchButton}" press="onPressSearchButton"/>
        </FlexBox>
    </FlexBox>
</FlexBox>



Controller code:

/* Adding focus Events (focusIn & focusOut) to ProcessOrder*/
			var orderLabel = this.getView().byId("orderLabel");
			orderLabel.addEventDelegate({
				onfocusin: $.proxy(function (oEvent) {
					var order = oEvent.srcControl;
					order.addEventDelegate({
						onfocusout: $.proxy(function (oEvent) {
							var orderNumber = oEvent.srcControl.getValue();
							if (orderNumber.length > 3) {
								this.populatePlantAndStorageLocation(orderNumber, null);
							}
							var storageLocationLabel = this.getView().byId("storageLocationLabel");
							storageLocationLabel.focus();
						}, this)
					});
				}, this)
			});


			/*
			 * Adding focus Events (focusIn & focusOut) to StorageLocation
			 */
			var storageLocationLabel = this.getView().byId("storageLocationLabel");
			storageLocationLabel.addEventDelegate({
				onfocusout: $.proxy(function (oEvent) {
					var storageLocationNumber = oEvent.srcControl.getValue();
					if (storageLocationNumber.length > 3) {
						this.populateWarehouseDetails(storageLocationNumber, null);
					}
					var idSearchButton = this.getView().byId("idSearchButton");
					idSearchButton.focus();
				}, this)
			});

Thanks,

Sneha

[former_member751591]

Thanks for coming to SAP Community for answers. The original question has received a helpful answer already, please post your question as a new question here:

Since you're new in asking questions here, check out our ourtutorial about asking and answering questions(if you haven't already), as it provides tips for preparing questions more effectively, that draw responses from our members.

Please note, that your post here won't be answered.

[former_member596346]

Hello sneha,

Let me tell you the problem why this is happening.

Focus out event is used when focus changes. In your case when you move by enter key then you are changing the focus but when you use mouse and click the search button then there is conflict between focus out event and button search method onPressSearchButton.