Appeler manuellement la validation côté client de MVC 3 pour les messages ajax

Question

Je suis en train de créer une application web MVC 3. Je veux utiliser les annotations de données sur ma classe d'entité et ensuite utiliser une validation discrète côté client avant de renvoyer un message au serveur. Cela fonctionne bien lors d'un envoi normal. J'obtiens la validation et le résumé de la validation si l'un des champs n'est pas valide. Cependant, je veux renvoyer les informations par ajax et json. Comment puis-je valider "manuellement" le formulaire du côté client, puis renvoyer l'information au serveur par ajax ? Vous trouverez ci-dessous une version résumée de mon code.

  public class Customer
    {
        [Required(ErrorMessage = "The customer's first name is required.")]
        public string FirstName { get; set; }

        [Required(ErrorMessage = "The customer's last name is required.")]
        public string LastName { get; set; }
    }

    <% using (Html.BeginForm()) { %>

    <%: Html.LabelFor(model => model.FirstName, "First Name")%>
    <%: Html.TextBoxFor(model => model.FirstName, new { @class = "TextBox", id = "Customer.FirstName" })%>
    <%: Html.ValidationMessageFor(model => model.FirstName, "*")%>

    <%: Html.LabelFor(model => model.LastName, "Last Name")%>
    <%: Html.TextBoxFor(model => model.LastName, new { @class = "TextBox", id = "Customer.LastName" })%>
    <%: Html.ValidationMessageFor(model => model.LastName, "*")%>

    <div id="CustomerEditSave" class="Button CustomerEditButtons" style="margin-right:40px;">
       <a href="#">Save</a>
    </div>

    <%: Html.ValidationSummary(true) %>

    <% } %>

J'ai essayé ce code mais il ne valide que le prénom et n'affiche pas le résumé de la validation.

    $("#CustomerEditSave").click(function () {
        $(form).validate();
        //Ajax call here
    });

Answer 1

        if(!$('#myform').data('unobtrusiveValidation').validate())
        {
           // add your extra custom logic
        } 
        else
        { 
             $('#myform').submit(); 
        }

Il déclenche la validation et renvoie un booléen, de sorte que vous pouvez vérifier avant de soumettre.

Answer 2

.Valid() fonctionne, c'est-à-dire qu'il vous indique si votre formulaire est valide. Cependant, seul, il ne permet pas d'afficher ET de masquer les messages correctement. Voici ma méthode de validation manuelle

function validate()
        {
            //valid() not only tells us whether the form is valid but 
            //also ensures that errors are shown !!!
            if ($("form").valid())
            {
                //if the form is valid we may need to hide previously displayed messages
                $(".validation-summary-errors").css("display", "none");
                $(".input-validation-error").removeClass("input-validation-error");
                return true;
            }
            else
            {
                //the form is not valide and because we are doing this all manually we also have to
                //show the validation summary manually 
                $(".validation-summary-errors").css("display", "block");
                return false;
            }
        }

Answer 3

I tried all of the above solutions but none worked on MVC5. 

J'utilise jQuery v2.1.4 et jQuery.Validation v1.11.1. J'ai besoin de déclencher la validation pendant le rendu de la page. Seul celui ci-dessous a fonctionné pour moi.

$(document).ready(function () {
   ...
   validateForm();
}

function validateForm() {`enter code here`
    var elem = document.getElementById('btnSave');
    elem.click();    
}

$('#btnSave').click(function (evt) {
    //evt.preventDefault();
    var form = $('form');
    if (form.valid()) {
        //Ajax call here
    }
    //$(".validation-summary-errors").css("display", "block");
});

function Validate() {
    // If no group name provided the whole page gets validated
    Page_ClientValidate();
}