API to update an element

[Vivid_Squid]

Is it possible to update an element via API, specifically a single select dropdown in form?

<a role="option" class="dropdown-item" id="bs-select-1-0" tabindex="0" aria-selected="false" aria-setsize="14" aria-posinset="1"><span class=" bs-ok-default check-mark"></span><span class="text">Dropdown Option 1</span></a>

[artur]

@Vivid_Squid can you pls elaborate a bit about the use case ?

[Vivid_Squid]

Hi @artur,
I would like to use an API endpoint to update the options in a form dropdown. Make.com has a make an API call module. I would set my scenario up to extract a JSON list of options from Airtable and UPSERT the options list.

Are there more API endpoints than just Users?

[artur]

We can provide client side JS based options to update the form on the client side. e.g. on form load you can trigger make api get options and update the form. would that work ?

[Vivid_Squid]

That should work. Can you expand on the process?

[artur]

I will share an example here once the code is ready in few days I think.

[Vivid_Squid]

Thank you very much, I look forward to your reply.

Are there no other API endpoints other than User?

[artur]

The user one is a backend api while the form options is more of a client side js use case.

[SonNguyen]

@artur

We can provide client side JS based options to update the form on the client side. e.g. on form load you can trigger make api get options and update the form. would that work ?

Hi Artur,
I’m interested in this too. After the React update, all form fields seem to have different ids and name attributes, and these ids change randomly on each page load. I can’t use previous codes to target those fields anymore.

[artur]

@SonNguyen have you checked those ?

How to listen to Form Block events and add Custom Code (React version)

Currently there are three events associated with Form Block submission: submit-form event is triggered before form submission. submit-form-success event is triggered after successful form submission. submit-form-failure event is triggered after unsuccessful form submission. <script> window.addEventListener('submit-form-form1', (e) => { // e.detail is an object with form field names and values console.log('form submit', e.detail); // form submit { "Full Name": "Softr", "Email": …

How to change a value of a form field in Form Blocks (React version)

Form blocks are listening to a special event called update-fields. When block is loaded block-loaded event is triggered after which one can set form field values in name, value pairs and trigger update-fields event. <script> window.addEventListener('block-loaded-form1', () => { const updateFields = new CustomEvent('update-fields-form1', { detail: { 'Full Name': 'Softr', 'Email': 'info@softr.io' } }); window.dispatchEvent(updateFields); }); </script> form1 is the name of the b…

[SonNguyen]

Hi @artur . I did. But those are for updating form fields only. I need to find a way to target individual fields using id/name attributes in order to perform other customizations to the form. They used to be the field names in Airtable, which were really easy to work with custom codes.

We have developed custom code features like limiting form input characters, scrolling to unfinished required fields, and getting current field values to perform other actions on the page… All are possible and easily be done with unique, predefined ids of these form fields.

With the current React version, they are all random and can change anytime.

[artur]

@SonNguyen we will be adding specific and permanent identifiers so you can rely on them early next week. In the meantime can you pls DM me some of your form code snippets so we can provide alternatives ?

[zaven]

Hi @SonNguyen, we did a small improvement on forms and added ids that will not change on reload. Can you check if it helps you.
We will add other attributes and events on forms soon that can help with your custom codes. I will keep you informed.

[SonNguyen]

Thanks @zaven & @artur This is great news! I can work with the new ids now. Just a quick question, could the number at the end of the id be removed? Or does it have to stay there?

[SonNguyen]

Could we remove the number at the end of these ids? I think each form on a page has different ids already and airtable field names are also unique.