Bonjour,
Voilà plusieurs jours que je cherche à régler un petit problème pour valider mon formulaire en jQuery. Le souci c'est que c'est un formulaire dynamique et jusque là, je n'ai eu affaire qu'à un seul formulaire.
La validation ne marche ni pour le premier formulaire affiché ni pour les suivants. Ma question est : comment se fait-il que ma validation ne s'applique pas pour le premier formulaire ?
PS: Ce code marche bien lorsque je n'ai qu'un seul formulaire!
<script src="http://code.jquery.com/jquery-1.9.0.js"></script>
<script src="js/jquery.min.js"></script>
<script src="js/jquery.validate.min.js"></script>
<input type="text" placeholder="Tél mobile" name="tel_m" >
<script>
countForms = 0;
createForms = function(){
countForms++;
newForm = $( "#templateForms" ).clone().appendTo( "#content" );
newForm.show();
newForm.attr('id', 'form' + '_' + countForms);
nom = newForm.find("[name=nom]");
prenom = newForm.find("[name=prenom]");
fonction = newForm.find("[name=fonction]");
tel_m = newForm.find("[name=tel_m]");
tel_d = newForm.find("[name=tel_d]");
tel_p = newForm.find("[name=tel_p]");
mail = newForm.find("[name=mail]");
fax = newForm.find("[name=fax]");
desc = newForm.find("[name=desc]");
nom.attr('name', nom.attr('name') + '_' + countForms);
prenom.attr('name', prenom.attr('name') + '_' + countForms);
fonction.attr('name', fonction.attr('name') + '_' + countForms);
tel_m.attr('name', tel_m.attr('name') + '_' + countForms);
tel_d.attr('name', tel_d.attr('name') + '_' + countForms);
tel_p.attr('name', tel_p.attr('name') + '_' + countForms);
mail.attr('name', mail.attr('name') + '_' + countForms);
fax.attr('name', fax.attr('name') + '_' + countForms);
desc.attr('name', desc.attr('name') + '_' + countForms);
$('#countForms').val(countForms);
/***Le mask**/
//tel_m.mask('(33) 9-99-99-99-99', {placeholder:'X'});
//tel_d.mask('(33) 9-99-99-99-99', {placeholder:'X'});
//tel_p.mask('(33) 9-99-99-99-99', {placeholder:'X'});
//fax.mask('(33) 9-99-99-99-99', {placeholder:'X'});
}
$("#createForms").on("click", function(){
createForms();
});
// décomentez ces lignes pour créer automatiquement un(des) formulaire(s) au début
createForms();
//createForms();
//createForms();
//createForms();
$(function()
{
// Validation
$("#sky-form").validate(
{
// Règles de validation
rules:
{
tel_m:
{
required: true,
digits: true
},
},
// Messages pour validation
messages:
{
tel_m:
{ required: 'Saisissez un numéro de téléphone',
digits: 'Entrez seulement des chiffres'
},
},
// Ajax form submition
submitHandler: function(form)
{
$(form).ajaxSubmit(
{
beforeSend: function()
{
$('#sky-form button[type="submit"]').attr('disabled', true);
},
success: function()
{
$("#sky-form").addClass('submited');
}
});
},
// Do not change code below
errorPlacement: function(error, element)
{
error.insertAfter(element.parent());
}
});
});
</script>
Afficher la suite