0

This is kind of show stopper for business.

Use case: We have to load a custom form with prepopulated values in certain fields, then do some processing on load of form and finally set the focus on certain input field so that user directly starts typing. This form is in console.

I created a simple form to replicate this: HTML:

<template>
    <lightning-record-edit-form record-id="01tA0000004zdkeIAA"
                                object-api-name="Product2"
                                onload={handleFormLoad}>
        <lightning-messages>
        </lightning-messages>
        <lightning-input-field field-name="Name">
        </lightning-input-field>
        <lightning-input-field field-name="ProductCode" >
        </lightning-input-field>
        <!-- Focus should go to this field after form loads -->
        <lightning-input data-id="in4" value=""></lightning-input>

        <lightning-input-field field-name="Family">
        </lightning-input-field>
        <lightning-button class="slds-m-top_small"
                          variant="brand"
                          type="submit"
                          name="update"
                          label="Update">
        </lightning-button>
    </lightning-record-edit-form>
</template>

Javascript:

handleFormLoad() {
    this.template.querySelector("lightning-input[data-id=in4]").focus();
}

this works perfectly fine in non-console lightning app but does not work in console app.

I noticed that in console app, input does get focus for about a second and then the focus shifts to somewhere else.

Note: Since lightning-input-field does not has focus() method, we are using lightning-input. When user enters values in those lightning-input fields, we are creating one final object to be updated/created before submitting, using lightning-input and lightning-input-field values (in onsubmit of form).

6
  • setTimeout() to the rescue?
    – zaitsman
    Jul 19, 2019 at 2:10
  • when the network is slow, we need to increase the timeout value which is going upto 7 seconds (problematic when form loads very fast), so cannot rely on it Jul 19, 2019 at 2:15
  • maybe then just put that focus with a null check into the rendered callback?
    – zaitsman
    Jul 19, 2019 at 2:17
  • 2
    is this a possible duplicate of salesforce.stackexchange.com/questions/270053/…
    – Ronnie
    Jul 19, 2019 at 2:27
  • 2
    not a duplicate, that requirement has problem of only input element identification. I am facing problem of shifting focus in console (note that its getting focus initially) Jul 19, 2019 at 2:37

0

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy