Comment puis-je activer/désactiver discrète de validation sur afficher/masquer via jquery?

Mise à jour:
Ce que je demande est de savoir si il est possible de supprimer des règles de validation, qui sont déduites à partir d'Attributs sur les champs de mon viewmodel, sur le côté client SEULEMENT.

--

Je suis basculement de l'affichage de certains champs, lorsqu'un choix est fait à partir d'une liste déroulante. J'ai besoin de passer à la validation.

ViewModel.cs:

public int ddlTypeID { get; set; }
public Dictionary<int, string> ddlTypes { get; set; }

[Required(ErrorMessageResourceName = "msgRequired",
    ErrorMessageResourceType = typeof(Resources.Globals))]
public DateTime firstDate {get; set;}

[Required(ErrorMessageResourceName = "msgRequired",
    ErrorMessageResourceType = typeof(Resources.Globals))]
public DateTime otherDate {get; set;}

Créer.cshtml:

<script type="text/javascript">
    $(document).ready(function () {
       $('.optional').hide();
       $('#ddlTypeID').change(function () {
            var id = $(this).val();
            if (id == 1) {
                $('.optional').show();
            } else {
                $('.optional').hide();
            }
        });
    });
</script>

@using (Html.BeginForm())
{
    <div class="editor-field">
        @Html.DropDownListFor(x=>x.ddlTypeID, new SelectList(Model.ddlTypes,"Key","Value",Model.ddlTypeID),Resources.Globals.msgType)
        @Html.ValidationMessageFor(model => model.ddlTypeID)
    </div>

    <div class="editor-label">
        @Html.LabelFor(model => model.firstDate )
    </div>
    <div class="editor-field">
        @Html.EditorFor(model => model.firstDate )
        @Html.ValidationMessageFor(model => model.firstDate )
    </div>

    <div class="editor-label optional">
        @Html.LabelFor(model => model.otherDate )
    </div>
    <div class="editor-field optional">
        @Html.EditorFor(model => model.otherDate )
        @Html.ValidationMessageFor(model => model.otherDate )
    </div>

    <input type="submit" value="Save" />
}

Cela fonctionne pour masquer/afficher les champs pour otherDate - mais comment puis-je basculer la validation en même temps? Ou est-il une meilleure façon de le faire?

Ce n' "activer / désactiver la validation"?
Je pense qu'il veut l'activer/la désactiver pour les champs indiqués.
Droit: si les champs sont cachés, alors j'ai besoin de désactiver les validateurs. Lorsque les champs sont affichés, j'ai besoin de ré-activer.
Ce qui se fait sur le serveur de validation? Comment comptez-vous gérer cela? Le serveur sait très peu de choses que vous utilisé du javascript pour afficher/masquer certaines parties de votre DOM. À partir du serveur de point de vue à la fois les champs sont requis dans votre application actuelle. Vous devez toujours d'abord résoudre le serveur de côté les problèmes de validation avant même de penser à la validation côté client. La validation côté Client est juste un bonus que vous pouvez vivre sans.
Côté serveur est fait, assez simple puisque j'ai la ddlTypeId. Les champs ne sont pas requis dans la base de données. J'ai seulement besoin de gérer le côté client.

OriginalL'auteur chris | 2012-02-29

  1. 1

    Il Fonctionne vrai.
    Mais vous avez besoin d'appeler ce code lorsque vous avez les éléments cachés sur le formulaire.
    bon code est :

    function IgnoreValidationForHiddenElements() {

  $.validator = $("#formid").validate(
               {
                   ignore: ":hidden"
               });
}

    ou lorsque vous mettez sur 

    $(document).ready(function () {
//Your Code
}

    lorsque vous avez besoin de cette option lors du Chargement du formulaire.

    Il ne peut également appeler .validate() parce que Discret Validation déjà des constructions et des appels .validate().

    OriginalL'auteur Meysam Fathee Panah

  2. 1

    J'ai ce besoin spécifique et a constaté que .Net MVC crée le "data-val" attribut sur le contrôle en cours de validation. Donner le contrôle que vous souhaitez activer la validation d'un premier id:

    <div class="editor-field optional">
    @Html.EditorFor(model => model.otherDate, new { @id = "ctlToToggle" )
    @Html.ValidationMessageFor(model => model.otherDate )
</div>

    Puis changer le "data-val" attribut sur le contrôle de vrai lorsqu'il est visible, et la valeur false lorsque cachés:

    <script type="text/javascript">
   $(document).ready(function () {
       $('.optional').hide();
       $('#ctlToToggle').attr("data-val", "false"); //Turn off validation on page load
       $('#ddlTypeID').change(function () {
           var id = $(this).val(),
               ctlToToggle = $('#ctlToToggle'); 
           if (id == 1) {
               $('.optional').show();
               ctlToToggle.attr("data-val", "true") //Turn on validation when visible
           } else {
               $('.optional').hide();
               ctlToToggle.attr("data-val", "false"); //Turn off validation when hidden
           }
       });
   });
</script>

    OriginalL'auteur Keith Ketterer

  3. 0

    jquery de validation en fait cela automatiquement si vous le demandez

    $validator = $("#formName").validate(
{
    ignore: ":hidden"
}

    Personnellement, je trouve JQuery validation de travailler beaucoup plus facile à utiliser que le MVC de validation, mais il implique d'apprendre à utiliser JQuery de validation si vous ne l'avez pas déjà fait.

    (JQuery validate est un plugin JQuery qui gère la validation d'un formulaire entièrement sur le côté client.)

    edit: retiré un peu de la parenthèse qui, avec le recul, l'OP évidemment le savait déjà. Mes excuses.

    Ce fut la première chose que j'ai essayé, mais l'utilisation de jquery pour afficher/masquer des champs ensembles display:none.
    oui - et si vous êtes à l'aide de JQuery valider votre formulaire de validation, et la valeur " ignorer: "cachés"' comme ci-dessus, la validation de l'ignorer tous les champs cachés. Cela ne fonctionne pas pour MVC validation, cependant.

    OriginalL'auteur Ben Barden

  4. 0

    Si vous mettez un 'id' sur votre élément d'entrée (ou utiliser le MVC-ID généré), vous pouvez alors utiliser le .règles() fonction pour supprimer les règles existantes et de les enregistrer pour être restauré plus tard:

    <script type="text/javascript">
  var savedRules;

  $(document).ready(function () {
    $('.optional').hide();
    $('#ddlTypeID').change(function () {
      var id = $(this).val();
      if (id == 1) {
        $('.optional').show();
        $('#otherDate').rules("add", savedRules); //Restore saved rules
      } 
      else {
        $('.optional').hide();
        $('#otherDate').rules("remove", savedRules); //Remove the rules so they don't trigger
      }
    });
  });
</script>

@Html.EditorFor(model => model.otherDate, new { id = 'otherDate' } )

    OriginalL'auteur Peter Gluck