Create custom identity to correctly fill a specific webform?

Hello. Is there a way to create a custom identity to fill the fields of a specific webform? I have a local supermarket competition where you enter a unique code for each entry card you receive, for me it's 5 or 6 per week. Along with this, each time I enter I need to fill a bunch of fields like first name, last name, other normal contact details, as well as a state dropdown (1P can't handle dropdown any more?) and "which store did you shop at?".

How can I create a custom identity and ensure each field in the identity is correctly mapped top the field on the form? Is there something in the code that I can inspect for to include in my 1P identity's label/field?

Thanks!


1Password Version: 7.4.3
Extension Version: Not Provided
OS Version: macOS Catalina
Sync Type: Not Provided

Comments

  • ag_ana
    ag_ana
    1Password Alumni

    Hi @bartkowalski! Welcome to the forum!

    Would you be able to also share a URL for this website, so we can look at the form?

  • bartkowalski
    bartkowalski
    Community Member

    Sure: https://www.iga.com.au/win/ (tap [enter] to get to the form I’m referencing).

    Thanks for the welcome! I’ve been using 1P since version 3 or 4 I think :)

  • bartkowalski
    bartkowalski
    Community Member

    If what I’m asking is possible, I’d like to be able to do this on any form, I.e, if there’s a way to sort of “reverse engineer” the form labels into 1P’s identity labels then I want to know how, cheers.

  • ag_yaron
    ag_yaron
    1Password Alumni
    edited February 2021

    Hey @bartkowalski ,
    It is indeed somewhat possible to "reverse engineer" the form. I did that using the 1Password 7.7 desktop app, your basic info here shows that you are using 7.4.3, so if that's true you'll have to update to the latest version before trying this.

    Basically all the fields on this form are called mat-input-X where X is the number of the field (there are 10 fields on the form so their numbers are between 0-9). You can find any field's name or ID by right clicking on a field and selecting "Inspect". If you are using Safari, you'll want to enable the develop menu in Safari's preferences before you can access that "Inspect" option.

    Now that we know the IDs of the fields, we can simply add them as custom fields of an identity item:
    1. Open the 1Password 7 desktop app and select one of your identity items or create a new one.
    2. Make sure that your basic info is properly filled in the correct fields in that identity item (e.g. first and last names, address, phone number, email etc).
    3. When you have all the basic fields filled out, scroll down to the bottom where you'll see some empty custom fields you can manually fill in.
    4. Select an empty "Label" and name it identically to the field's name/ID. for example, the first field on the form is the unique code for the raffle. It is called mat-input-0, so you can type "mat-input-0" in the empty label.
    5. Under the label, type whatever you want 1Password to autofill into that field (e.g. if your unique raffle code number is 313131, then type in 313131 into the field under the label).
    6. Repeat steps 4-5 for each and every field that is not being autofilled by 1Password. I noticed that the fields "contact number", "post code" and "what store did you shop at" are not being autofilled, so you'll want to create a custom field for each one of them (their IDs are mat-input-4 , mat-input-7, and mat-input-9).
    7. When you are done, click on "Save" to save the changes, then try autofilling with that identity item, see if it fills out these fields.

    The dropdown is another story and unfortunately there's no way to make this one work with 1Password. The entire form is pretty non-standardly built which is why we had to do so much manual work here to get it autofilling :)

  • bartkowalski
    bartkowalski
    Community Member
    edited February 2021

    Hi. Thanks for the detailed answer! That worked (once I realised I hadn't upgraded to the latest version). As [https://1password.community/discussion/111188/how-can-i-stop-1password-x-from-asking-me-to-click-ok-to-fill-your-1password-item-on#latest](this other thread) addresses, I'm now getting the whole "Click OK to fill your 1Password item on …" alert on every fill of every form. I understand this can be avoided by using inline form-filling? I haven't explored this feature with 1P yet, but if it'a anything like Safari's implementation, I'll need to click/tap to add an item for each individual field, rather than have 1P autofill all fields on a webform in one fell swoop?

  • ag_yaron
    ag_yaron
    1Password Alumni

    Hey @bartkowalski ,
    I'm glad to hear that worked :)

    We've added another security layer for autofilling identities and credit cards in the form of a confirmation prompt. There's currently no way to disable it, but things might change so keep your apps up to date to enjoy the latest improvements and features.

    As for the inline menu that you mentioned (the Safari implementation), you don't need to fill every field separately. Once you select something from the inline menu on any field, it will autofill the entire form.

  • bartkowalski
    bartkowalski
    Community Member

    Good news on both fronts. Thanks for your help!

  • ag_yaron
    ag_yaron
    1Password Alumni

    My pleasure :+1:

This discussion has been closed.