0

I have multiple forms in my page which has same values.

Instead of writing multiple rules and messages, I have written a common method where rules and messages can be pass as a parameter.

But this works only if a page has different form values. And if a page has multiple forms with similar values then am unable to bind it, because I don't want to write multiple rules and messages. Because both the forms has to display the same error messages, if the validation fails.

So in the below code, both the rules and messages are same, how do I can use one set of rules and messages to display for both the forms accordingly.

This is what I tried.

HTML:

<form id="form1">
  <label for="firstName1">First Name </label>
  <input id="firstName1" name="firstName1" required/>
  <label for="lastName1">Last Name </label>
  <input id="lastName1" name="lastName1" required/>
</form>

<form id="form2">
  <label for="firstName2">First Name </label>
  <input id="firstName2" name="firstName2" required/>
  <label for="lastName2">Last Name </label>
  <input id="lastName2" name="lastName2" required/>
</form>

JS:

Validation Common Method:

window.validation = {
   validateForm : function(that, fId, rules, messages, handlerFnc){
    var _self = this, _this = that;
    return {
      rules : rules,
      messages : messages,
      submitHandler: function(fId, evt) {
        var serForm = $(fId).serialize();
        (handlerFnc) ? handlerFnc(fId, _this, evt) : null;
      }
    }
  }
}

Calling this method in my View:

    var rules = {}; var messages = {};
          rules.firstName1 =  {
            required: "FN Req Field"
          };
          messages.lastName1 = {
            required: "LN required field"
          };
          rules.firstName2 =  {
            required: "FN Req Field"
          };
          messages.lastName2 = {
            required: "LN required field"
          };
          $('#form1').validate(validation.validateForm(_self, "form1", rules, messages, _self.handlerFn2));
          $('#form2').validate(validation.validateForm(_self, "form2", rules, messages, _self.handlerFn2));
3
  • What's wrong with what you have? Commented Jun 9, 2016 at 0:22
  • @Barmar: I want to centralised the rules and messages, as both the forms has same values. Is there a way to keep the one set of rules and messages for both the forms. Instead of repeating them. Commented Jun 9, 2016 at 0:28
  • Isn't that what you've done with your rules and messages variables? Where is the repetition? Commented Jun 9, 2016 at 0:29

1 Answer 1

1

Ideally you would be able to use $("#form1, #form2").validate(...), but the jquery-validate implementation only operates on the first element it's called on. So you can use .each()

$("#form1, #form2").each(function() {
    $(this).validate(validation.validateForm(_self, "form1", rules, messages, _self.handlerFn2));
});
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.