Wet-boew: Add custom parameters to the initialization of the validator plugin.

Created on 7 Feb 2018  ·  5Comments  ·  Source: wet-boew/wet-boew

Hi,

I have an issue where I am trying to catch the initialization of the validator plugin for forms in pages. (wathever.validate()). I wanted to extend the showErrors function in this plugin as shown in the documentation:

$(document).ready(function () {
    $("form").validate({
        showErrors: function (event, validator) {
            deleteCurrentAlert();
            this.defaultShowErrors();
        },
    });
});

The problem with that is that you cannot bind 2 different initialization to the same element. I need to capture this original validate(). Is this done somewhere in the wetTemplate? Is there another way to extend the function that create the top

My goal in the end is to erase our server-side validation alert alert-danger section in order to keep 1 alert div at the top.

Thanks

Form Validation Question Resolved

Most helpful comment

My goal in the end is to erase our server-side validation alert alert-danger section in order to keep 1 alert div at the top.

Erasing the server-side validation might cause severe vulnerability security issue in your form.

All 5 comments

My goal in the end is to erase our server-side validation alert alert-danger section in order to keep 1 alert div at the top.

Erasing the server-side validation might cause severe vulnerability security issue in your form.

Erasing the server-side validation might cause severe vulnerability security issue in your for

Are we talking about erasing it completely or just erasing it to make place for the errors on the validator plugin? I am talking about the second case.

At first I wanted to simply add my server-side error to the validator plugin using showErrors({"inputID":"message"}) but I realized this won't do it because the method require you to link the error to a field. This would be fine but then it wouldn't work for all of them (ex: checkbox). Plus, often, those server message are not referring to a specific field but multiple or none of those field and the plugin doesn't support that.

So I was thinking of displaying my error message on page load inside an alert-danger section, then when the validator start working, replace the section with validator's alert-danger section.

All because we want to avoid 2 alert-danger section. I have discussed with other developers in other teams and what I have seen is they use 2 div when the user trigger all the error.

Are there any option left? Should we just use 2 section alert-danger?

I believe if you use:

<section id="errors-validation-example" class="alert alert-danger" tabindex="-1">
<h2>The form could not be submitted because 1 error was found.</h2>
<ul>
<li>
<a href="#required-group-0">
<span class="prefix">Error&nbsp;1: </span>Phone Numbers - Please fill at least 1 of these fields.
</a>
</li>
</ul>
</section>

For the server side error when client side is triggered it replaces the error box, so visually there be only one error section at a time.

Thanks for the reply, I tested your solution and it did not work at first but then I inspected the HTML and changed

If it's intended it should definitively be included in the documentation.

I don't think it was intended, but it works cause the ID is generated using the form id/name (that why you probably had to change yours) and when the javascript creates the validation section it essentially well replace any section that exist with the same ID.

Was this page helpful?
0 / 5 - 0 ratings