1

JSFiddle: https://jsfiddle.net/fho6m3cr/33/

I'm using jQuery Validation without a Submit button -- instead there's a regular button that invokes $('#form).valid().

I populate my initial fieldset in document.onReady and then 1 more dynamic field after you click the Add button. The Add button receives its rule but never gets picked up and skips validation.

I initialize as

// First initialize jQuery Validation
$("#form").validate({});
// Add first-level validators
$("#form select, #form input:not(input[type=button], input[type=submit], input[type=hidden])").each(function(){
           $(this).rules("add", { required: true } );
});

and then Add is supposed to handle the new field by adding the same Select/Input validation when it's clicked.

// (Re-)append validator
  $("#form select, #form input:not(input[type=button], input[type=submit], input[type=hidden])").each(function(){
       $(this).rules("add", { required: true } );
});

But it's not working: the newly-added field doesn't get validated. The original one does. The structure of the Form and subsequent DIV is correct.

NOTE There is only 1 possible click of the Add button -- no unique IDs anywhere.

gene b.
  • 10,512
  • 21
  • 115
  • 227
  • 1
    You can't repeat ID's in a page...they are unique by definition. Also simpler to just add `required` attribute – charlietfl Jan 23 '18 at 18:01
  • But which IDs are repeated? There is only one #form. The text fields' IDs are different. You can check the JSFiddle's layout in Dev Tools. – gene b. Jan 23 '18 at 18:05
  • In your `add` you have hard coded ID's – charlietfl Jan 23 '18 at 18:08
  • I have hard-coded the ID `id="textAdded"` which is different from the ID `id="text1"`. They are quite different. – gene b. Jan 23 '18 at 18:15
  • sure but click button several times and those get duplicated – charlietfl Jan 23 '18 at 18:17
  • I'm not asking about that. Even on the *first* click of the Add button validation doesn't work -- and it should! – gene b. Jan 23 '18 at 18:18
  • If you're simply adding the `required` rule, you could just use the `required="required"` HTML5 attribute and skip the `rules()` method entirely. Even so, if you do not have unique `name` attributes, you'll continue to face the same issue. – Sparky Jan 23 '18 at 18:38
  • 2
    Yep... I looked at your jsFiddle... **you have not created any `name` attributes**. The plugin needs them. Read first sentence here: https://jqueryvalidation.org/reference/#link-markup-recommendations – Sparky Jan 23 '18 at 19:05
  • thanks the fiddle works now https://jsfiddle.net/fho6m3cr/34/ – gene b. Jan 23 '18 at 19:26

0 Answers0