SAPUI5 Set Focus on Input Field

Question

i have the following Problem:

I have 2 XML Views with a few input fields and at navigation to the second view the focus should be on the 5th(ID = "RueckmeldeNr") field.

I tried several things but nothing worked.. If i use the jQuery delayedCall the focus shortly flashes on the input field but is instantly set to the NavBack Button in the upper left corner.
Do i use the method false or forget something? How can i solve this?

onAfterRendering : function(oEvent) {
oInputRueck = this.getView().byId("RueckmeldeNr");
//  this.getView().byId("RueckmeldeNr").focus();
//  this.getView().byId("RueckmeldeNr").$().focus();
//  jQuery.sap.delayedCall(200, this, function() {
//      //this.getView().byId("RueckmeldeNr").focus();
//      oInputRueck.focus();
//   });
//  var oFocusInfo = this.getView().byId("RueckmeldeNr").getFocusInfo()
//  this.getView().byId("RueckmeldeNr").applyFocusInfo(oFocusInfo);
    jQuery.sap.delayedCall(0, this, function() {
        oInputRueck.focus();
    });
},

I hope you can help me!
Thank you

Solution 1

Just a suggestion:

You could set focus to the required field in the view (or where ever you define it).

For example, in view1 you define:

var oInput = new sap.m.Input({id: "inputID"})
.addEventDelegate({
    onAfterRendering: function(){
        oInput.focus();
    }
});

and then, when you call the view, the focus should be set to the required field automatically.

Here is a working JSBIN example: LINK

Solution 2

Answer is solved by myself.

I just put the delayedCall on 500 miliseconds and it worked.

jQuery.sap.delayedCall(500, this, function() {
    this.getView().byId("RueckmeldeNr").focus();
 });

Comments

[Boghyon Hoffmann]

It works but delayedCall / setTimeout with ms higher than 0 should be avoided. Instead, make use of appropriate events such as afterShow, afterOpen, after*, ... depending on which control is used as a container.

[Daz]

I tried this in desperation, and although it sort of works, it's a hack. Eventually I fixed this properly by setting autoFocus = false on my sap.m.App container. Credit to @schnoedel for this answer: stackoverflow.com/a/36390429/1499294

[Boghyon Hoffmann]

This works great when there is no navigation involved. When there is, however, the first focusable control would be focused instead when the user navigates back, because usually the controls do not rerender on back-navigation. A documented solution is to make use of navigation related events such as afterShow.