1

I know that on lightning-input you can set autocomplete="off" to deactivate browser autofill feature. Now I am looking for something similar to this on lightning-input-field.

Has anyone found any workaround for this? Do I really have to rewrite all with lightning-input?

enter image description here

Currently i am using record-edit-form with input-field.

<div slot="modalContent" class="modalContent slds-modal__content slds-p-around_medium">
    <lightning-record-edit-form object-api-name="ImpartnerMDF__FundsClaim__c" onsuccess={handleSuccess}>
        <lightning-messages></lightning-messages>
        <lightning-input-field field-name="Invoice_Payee_Name__c" required autocomplete="off"></lightning-input-field>
    </lightning-record-edit-form>
</div>

I know about this post that seems to be related, but there are discussing aura component aura:input which really is not what I am using here, lwc component lightning-input-field. As far as I know the autocomplete attribute needs to be set on the html input tag, and from lwc shadow DOM perspective we are not able to dynamically query for this element via js.

I was thinking that maybe load js as static resources could bypass shadow DOM? -> Nope, even externally loaded script could not cross the shadow dom boundary for me.

Another approach I was thinking about would be to use lightning-input just for input, then have lightning-input-field with display: none; to which via js I will force the values.

2
  • Why don't you add your workaround as an answer? That way this question gets an answer and people can vote on it which gives a hint to future people that this works.
    – Nick Cook
    Sep 20, 2021 at 23:14
  • Will do, this question were closed as duplicate and got opened just recently.
    – Damecek
    Sep 21, 2021 at 10:07

1 Answer 1

1

Never mind, the last guess was the most successful. Use lightnig-input with autocomplete="off", hide the input-field. Via onchange event, set the value from lightning-input to input-field.

Only bad thing on this solution is that you will lose the validation messages on the input-field which is hidden. But there is a workaround for this as well, something like displaying custom error messages.

Your Answer

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

Not the answer you're looking for? Browse other questions tagged or ask your own question.