CODEWITHSUNDEEP
sapui5
Mario
Mario

Reputation: 43

How to set focus on an Input field in a sap.ui.table.Table

I want to set the focus on a input field in a row in the table. How can I read the Id of this row and set the focus?

for(var i = 0; i < rowCount; i++) {

   var oEntry = this.getView().getModel("items").getProperty(
   oTable.getContextByIndex(i).sPath);

   if (oEntry.Field1 === sField1){
      //Here I will set the focus in an Input field
   }
}

Thanks

Edit: 

<columns>
    <Column width="2rem" sortProperty="Field">
        <m:Label text="{i18n>Field}" />
        <template>
            <m:CheckBox
                selected="{
                path: 'items>Field',
                type: 'sap.ui.model.type.String'
                }"
            editable="false" />
        </template>
    </Column>
    <Column width="6rem">
        <m:Label text="{i18n>Field1}" />
        <template>
            <m:Text text="{items>Field1}" />
        </template>
    </Column>
    <Column width="6rem">
        <m:Label text="{i18n>Field2}" />
        <template>
            <m:Input
                value="{items>Field2}" />
        </template>
    </Column>

This are the columns of my table in the view: I want to get the focus on the line, where Field1 = s.Field1. How can I set the id in a special line ?

Edit 2.0:

XML View: 

<Column width="6rem">
    <m:Label text="{i18n>Field2}" />
    <template>
        <m:Input
            id="input2" value="{items>Field2}"/>
    </template>
</Column>

Controller: 

for(var i = 0; i < rowCount; i++) {
    var oEntry = this.getView().getModel("items").getProperty(
                              oTable.getContextByIndex(i).sPath);
    if (oEntry.Field1 === sField1){
        this.getView().byId("input2").focus();

     }
}
this.getView().getModel("items").refresh(true);

Upvotes: 0

Views: 6369

Answers (2)

Sergei Vavilov
Sergei Vavilov

Reputation: 393

You also could do something like following:

var oTable = this.getView().byId("idTable");
var aRows = oTable.getRows();
for (var i = 0; i < aRows.length; i++) {
    if (aRows[i].getBindingContext().getObject().Field1 === sField1) {
        var oCell = aRows[i].getCells()[2]; // select 3rd cell
        oCell.focus(); // focus on the Input field
        break;
    }
}

Upvotes: 1

Developer
Developer

Reputation: 361

You could try getting the view through its ID and then use the focus() function to set the focus to it.

For example,

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

or if your input has an id, say "input1" then you can do this

this.getView().byId("input1").focus();

EDIT: Assuming input is the element you want to ID then it's simple to do so,

<Column width="6rem">
    <m:Label text="{i18n>Field2}" />
    <template>
        <m:Input
            value="{items>Field2}"
            id="input1" />
    </template>
</Column>

Upvotes: 0

Related Questions