Validieren dynamisch richtig hinzugefügte Felder in jQuery

Question

Ich weiß, dass ein Felder name und id benötigt, um validiert werden zu können.

Mein Problem ist, dass ich immer wieder hinzugefügte Felder zulassen müssen, um das Formular hinzugefügt werden, die die gleiche name haben (so dass ich sie serverseitig lesen kann).

Als Ergebnis wird nur das erste dynamisch hinzugefügte Feld validiert, andere nicht, und es wird auch gesendet, wenn es leer ist. Hier

ist eine Probe meiner Grundeinstellung: http://jsfiddle.net/kneidels/07m6bru2/

Gibt es irgendeine Art von Work-around für dieses?

Answer 1

Dies könnte nicht eine saubere Lösung, sondern eine mögliche Abhilfe, zählen Eingabefelder halten in einer Variablen und jedes Mal eine neue Steuerung id/Name wie erstellen:

$(document).ready(function() { 
var controlNumber = 4; //assume you have 3 controls in form 
$('#myform').validate({ // initialize the plugin  
    submitHandler: function (form) { // for demo 
     alert('valid form submitted'); // for demo 
     return false; // for demo 
    } 
}); 

$('button').one('click', function() { 
    var ctl = '<input name="product['+controlNumber+'][name]" id="form_product[3][name]" data-rule-required="true">';   
    $('#myform').append(ctl); 
    controlNumber++; 
}); 
});