Reset form issues

Antony · February 2, 2020, 2:42pm

So I had a form with id f_update_contact, and in order to keep things consistent I decided to change it to f_edit_contact.

Since it is reset by a few different button clicks and I couldn’t remember quite how many and where they were, I changed the name using search and replace in the code, and found one of the buttons which is supposed to reset the form wasn’t doing the reset any more. I know it was working previously, I had used it 2 minutes before.

So I’ve re-created the on-click event for the button and re-selected the form reset, but resetting the form just won’t work any more…

… I’ve changed the name back to f_update_contact, and it still won’t reset after selecting the action using the menus…

… But other actions I put on-click on the button work fine…

Can anyone help me understand what could be going on?

Thanks,
Antony.

Teodor · February 2, 2020, 2:48pm

What is the button code?
Do you see any errors in the browser console, when you click the button?

Antony · February 2, 2020, 2:53pm

Thanks for your response on a Sunday @Teodor!

There are no console errors…

Here is the button:

<button class="btn button_save" id="b_add_contact" dmx-on:click="f_update_contact.reset();f_update_contact.h_contact_id.setValue(0)">Add Contact</button>

And here is the form:

<form novalidate id="f_update_contact" autocomplete="off" method="post" is="dmx-serverconnect-form" action="dmxConnect/api/Contacts/update_contact.php" dmx-populate="contact.data.contact" dmx-on:success="notification.success('Contact updated...');search_contacts.load({contact_tag: f_contact_search.i_contact_search_tag.value, region: f_contact_search.i_contact_search_region.value, activity: f_contact_search.i_contact_search_activity.value, activity_type: f_contact_search.i_contact_activity_type.value, activity_tag: f_contact_search.i_contact_search_activity_tag.value, name: f_contact_search.i_contact_search_name.value, is_deleted: 0, test_mode: v_test_mode.value, show_demo_data: show_demo_data.value, show_only_demo_data: show_only_demo_data.value});contact.load({id: h_contact_id.value})" dmx-on:error="notification.warning('Item update error. :-(')" dmx-on:invalid="notification.warning('Item update invalid. :-(')" dmx-on:abort="notification.warning('Item update aborted. :-(')">

The .setValue works, but the .reset() doesn’t any more!

mebeingken · February 2, 2020, 3:12pm

You might try this format

<button class="btn button_save" id="b_add_contact" dmx-on:click="f_update_contact.reset().then(f_update_contact.h_contact_id.setValue(0))">Add Contact</button>

Antony · February 2, 2020, 3:46pm

Hey @mebeingken, thanks for that!

However the issue is more fundamental than that… even if the button just does the reset and nothing else, the form isn’t reset… so the issue is something around the reset itself.

It is kinda like I broke App Connect’s ability to reset the form when I changed the name!

mebeingken · February 2, 2020, 5:36pm

Are there any clues in the browser dev console?

I don’t suppose you have the previous version elsewhere for reference? Git? Production version? Local computer file backup?

Antony · February 2, 2020, 10:14pm

Hi @mebeingken… No, I was in the middle of an edit, so no backups and nothing in the dev console.

The same button happily resets another form on the same page.

But the form I want to reset, f_update_contact as it is now called, flatly refuses to be reset. I have two buttons and neiher of them reset it any more.

@Teodor, can you help me please? Is there something internal to Wappler that we can look at or reset in some way to make my form reset work again? Or some simple way in which I can re-build it to maybe make it work?

Thanks!

Antony.

Teodor · February 3, 2020, 8:18am

@Antony
I just copied and pasted your code on an empty page and added a text input in the form. Everything works as expected and the form resets on clicking the button.
Can you provide a link to your page, where we can check what’s wrong?

Antony · February 3, 2020, 9:01am

Hi @Teodor, thanks for looking at that… I am trying to upload it from my local machine but the FTP isn’t working… so I’ll find a way around that and give you a link later today!

Teodor · February 3, 2020, 1:35pm

Question answered in a personal message.
The form reset event works as expected - i.e. resets the form inputs to their default values (what the default HTML forms behaviors is) and this is different than clearing form inputs.

The dmx-bind:value is be the default value, any user input or when set using setValue will be discarded and it will reset back to the value set on the value attribute.

Antony · February 3, 2020, 1:42pm

Thanks for your help @Teodor!