Dmx-on:invalid being triggered without the server action sending a 400 reponse

Wappler General
1

Bug or user error?

I have a simple form with an email input. This happens:

image
image858×616 42.2 KB

Form code:

  <form id="reset_pass" method="post" is="dmx-serverconnect-form" action="api/Security/Passwords/request_new_pass" dmx-on:success="reset_pass.reset();checkInboxBrowser.goto('/inbox')" dmx-on:invalid="loginError.show();loginError.setTextContent('This email is not registered');email.focus()">
                        <div class="login-form-wrapper">
                            <div class="login-form-input">
                                <label for="email" class="form-label">Email:</label>
                                <input id="email" class="form-control" name="email" aria-describedby="email_help" placeholder="your email address" required="" data-msg-email="This email is not valid." type="email" data-rule-email="">

                            </div>
                            <div class="alert mt-2" id="loginError" is="dmx-bs5-alert" role="alert" type="danger" dmx-animate-enter.duration:500="'heartBeat'">
                                <p>Error</p>
                            </div>
                            <div class="login-form-button mt-5">
                                <button type="submit">Send me instructions</button>
                            </div>
                        </div>
                    </form>

Proof that the server action isn’t being triggered (no network request):

2021.08.09 14.24 - 2722 - Albacoretuna

From my understanding, the dmx-on:invalid should only be triggered if the server action responds with a 400 (validation) error.

So why is this alert being show, is it also triggered by client side validation errors?

2

This may help you
https://docsdev.wappler.io/guides/check-if-a-database-record-already-exists-before-inserting-a-new-entry

TLTR: The validation is performed on the server. No need for the dmx-on bit

3

But actually, the server validation is not being run. The server action is not called because the client side validation hasn’t passed

4

To test, remove the dmx-on:invalid=......... bit and make sure that the validation linked field has been set.

image
image687×504 20.1 KB

Then press the submit button and you will see it working.

5

Ben thanks for the help! I feel like we are not talking about the same thing, my issue is not that the validation isn’t working.

The client + server side validation work fine. My issue is that I want to show an alert only when the server side validation is failing.
But the alert is showing even WITHOUT the server action being triggered.

My setup is the exact same as in this tutorial https://docsdev.wappler.io/guides/password-reset-functionality-part-2

image
image1039×1216 290 KB

It says “this event will be triggered by the response steps with status of 400, which we added in the server action”

However, this response is being triggered WITHOUT the server action being called. So the server action can not return a status of 400, because it’s not even working.

1 Like