JQuery valider dynamiquement ajouter des règles

Question

J'utilise actuellement le plug-in validate pour valider un formulaire (à l'aide de contrôles ASP.Net). J'ai supprimé les règles de la configuration standard dans la méthode form.validate, par exemple:

    $("form").validate({

    rules: {
        ctl00$ContentPlaceHolder1$dgQuestions$ctl14$iRadList_Col0: "required"
    }

});

Je les ai maintenant dans diverses fonctions qui ajoutent les règles en fonction du bouton sur lequel on clique. Cela fonctionne très bien pour les zones de texte, mais pour un RadiobuttonList lorsque le plug-in tente d’ajouter la règle, une erreur indique que l’élément n’est pas défini.

function addRuleSet() {
    $("#ctl00$ContentPlaceHolder1$dgQuestions$ctl14$iRadList_Col0").rules("add", { required: true });

}

Je pense que le problème est que j'utilise l'attribut name (asp met $ in) pour définir le groupe auquel les boutons radio appartiennent plutôt qu'un id (, mais dans les paramètres statiques, tous les éléments sont définis à l'aide du nom Quoi qu’il en soit, je ne sais pas comment résoudre le problème en ajoutant une règle à un groupe de boutons radio associés, tout conseil serait apprécié.

PS, j’ai vraiment besoin d’appeler RadioButtonList plutôt que les boutons radio individuels.

Answer 1

Vous pouvez également appliquer une règle en définissant des classes sur l'élément. Par exemple, si vous indiquez la classe "required" à une entrée, la règle requise s'applique à cet élément. Pour ce faire, vous utiliseriez la propriété CssClass sur le contrôle. Vous devrez peut-être expérimenter des contrôles composés, tels que RadioButtonList, pour vous assurer que la classe est appliquée aux éléments d'entrée générés, pas au conteneur. Si cela vous pose problème, vous pouvez, par exemple, ajouter la classe à l'aide de jQuery après le chargement de la page en fonction d'un sélecteur.

<asp:RadioButtonList id="RadList" runat="server" CssClass="required">
   ...
</asp:RadioButtonList>

ou

<script type="text/javascript">
     $(function() {
          $(':radio').addClass('required');
          $('form').validate();
     });
</script>

Pour une règle complexe basée sur une classe, vous pouvez ajouter de nouvelles règles à l'aide de addClassRules .

<script type="text/javascript">
    $(function() {
        $.validator.addClassRules({
             range0to10: {
                  range: [0, 10]
             },
             name: {
                  minlength: 2,
                  required: true
             }
        });
        $('form').validate();
    });
</script>

<form ... >
<input type="text" name="rating" id="rating" class="range0to10" />
<input type="text" name="firstName" id="firstName" class="name" />
<input type="text" name="lastName" id="lastName" class="name" />
</form>

Answer 2

Après des jours de fou qui me rendaient fou, poser la question me faisait penser à comment bien renvoyer l'élément, et je suis tombé sur cette méthode de référencement de staright away qui me permet de le faire:

$("input:radio[name='ctl00$ContentPlaceHolder1$dgQuestions$ctl14$iRadList_Col0']").rules("add", { required: true });