Comment définir des classes de validation pour les zones de texte dynamiques dans un tableau ?

Définir la classe de validation pour une zone de texte dynamique dans un tableau

Ce problème survient lors de la création d'un tableau contenant une rangée de zones de texte dynamiques et l'objectif consiste à ajouter une classe de validation à toutes les zones de texte.

Le code original tentait d'utiliser jQuery pour ajouter le input.input-validation-error à toutes les zones de texte à l'intérieur du tableau, mais il n'a pas réussi à appliquer la classe correctement. Pour résoudre cela, la solution implique :

1. Ajout d'attributs Data-Val aux zones de texte :

Pour garantir une validation transparente côté client, il est crucial d'inclure les attributs data-val nécessaires aux zones de texte et aux éléments d'espace réservé pour afficher les messages de validation. Cela permet à jquery.validate.unobtrusive.js d'effectuer une validation côté client.

2. Fournir un objet ClsTargetInfo par défaut :

Initialisez la propriété TargetInfo avec un objet ClsTargetInfo par défaut. La représentation HTML de cet objet sera générée dans la vue.

3. Modification du code HTML de la ligne dynamique :

Dans le code HTML, supprimez les attributs d'identification inutiles des zones de texte et ajoutez des éléments d'espace réservé pour les messages de validation. Assurez-vous également d'inclure une entrée masquée pour l'indexeur afin de permettre une indexation non consécutive.

4. Génération du HTML de la nouvelle ligne :

Créez un élément caché à l'extérieur des balises du formulaire et copiez-y le code HTML de la ligne dynamique. Remplacez toutes les instances de l'indexeur par un caractère factice et mettez à jour la valeur de l'entrée masquée pour qu'elle corresponde au caractère factice.

5. JavaScript pour ajouter de nouvelles lignes :

Mettez à jour JavaScript pour cloner la nouvelle ligne, remplacez le caractère d'indexeur factice par un indexeur unique, puis ajoutez la nouvelle ligne. N'oubliez pas d'analyser le validateur après avoir ajouté de nouvelles lignes pour activer la validation côté client.

6. Notes supplémentaires :

• Préférez utiliser CSS pour le style plutôt que les styles en ligne.
• Envisagez d'utiliser des entrées masquées pour l'indexation au lieu des boutons de suppression.
• Utilisez BeginCollectionItem assistant pour une meilleure maintenabilité.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!