Form inputs validator not working (only working on the first input) - NodeJS - SPA

Wappler General Bugs
#1

Wappler Version : 3.3.5
Operating System : Windows 10 Pro

Expected behavior

If I click on the submit button, every invalid input should show an error.

Actual behavior

Only the first input shows an error.

How to reproduce

Create a form with various different inputs (name, email, url…), and add them some validator rules like required etc… and try it on your website.

For information, I also tried to duplicate the first input (which is the only input where the validator works) and it’s not working even if the configuration is the same (just different name and ID).

It was working perfectly before moving from regular NodeJS project to SPA.

ReCaptcha not showing on a content SPA page
#2
#3

Where is the form located and the dmxValidator.js include, on the content page or layout page? Are the inputs located in the same page as the form, so not form on layout page and inputs on the content page.

#4

Thanks for your answer @patrick!

The file is included in the layout page. The inputs (and the form itself) are in a content page.
They are not separated at all, same content page. :slight_smile:

#5

An extra question, does it matter if the page is loaded using ajax or loaded directly using the url? Does it work after a browser refresh if loaded via ajax?

#6

Wether I try in after the page has been loaded using Ajax or directly using the URL (Page refreshed or not), it’s not working unfortunately.
I’ve sent you the link to test in a PM :slight_smile:

#7

For information, it’s not really a bug, by checking the code, @patrick noticed that the code for the Button (outside the form) ws including a “true” setting here:

<button type="button" class="btn text-uppercase btn-success" dmx-on:click="modal_add_resource.form_add_resource.submit(true)">Add</button>

Removing “true” fixed it!

The correct code is:
<button type="button" class="btn text-uppercase btn-success" dmx-on:click="modal_add_resource.form_add_resource.submit()">Add</button>

Thanks a lot @patrick! :muscle:

#8