jQuery.validationEngine v2.6.1 Only Validates Some

2019-09-02 23:53发布

问题:

The code appears to be hooked up (like this)

jQuery("#contactForm").validationEngine();

because it will validate and raise an error bubble if:

  • you tab out of required field without any input
  • you type at least one character into a field that requires more and then click the submit button

But it will not validate and raise an error bubble if you do nothing at all except click the submit button. In that case, it just submits. Once you click in the field or enter anything at all, it seems to work.

What can I be looking for that I've mis-configured?

The HTML:

<form class = "contactform" id = "contactForm">
    <fieldset>
        <div class="contactform-name contactform-field">
            <label class="contactform-label" for="contactform-name">Name:
                <br>
            </label>
            <input class="validate[required,minSize[8]] contactform-input" type="text" id="contactform-name" name="name" />
        </div>

        <div class="contactform-email contactform-field">
            <label class="contactform-label" for="contactform-email">Email Address:<br></label>
            <input value class="validate[required,custom[email]] contactform-input" type="email" id="contactform-email" name="contactform-email" />
        </div>

        <div class="contactform-text contactform-field">
            <label class="contactform-label" for="contactform-text">Message:
                <br>
            </label>
            <textarea class="validate[required,minSize[12]]contactform-input" name="text" id="contactform-text" > </textarea>
        </div>

        <input class="contactform-button" type="submit" name="submit" value="Send" />

    </fieldset>
</form>

The JavaScript (it's running in Meteor):

Template.Contact.rendered = function () {
    jQuery("#contactForm").validationEngine();
}

回答1:

I've never used this engine, but from the docs I found that 'attach' will attach the validator to form.submit. Can it be as simple as that?

https://github.com/posabsolute/jQuery-Validation-Engine#attach

EDIT:

You can also do stuff to the submit-event (if the tip above won't help).

Something like this (not tested, but should put you in the correct path):

Template.templateName.events({
   'submit': function(event) {

      // Prevent the submit with preventDefault()
      event.preventDefault();

      // Do something to check the submit etc.

   }
});