Question

J'ai un formulaire simple. Son a un champ et un bouton de soumission. Je cache le bouton d'envoi. Le bouton d'envoi est en fait déclenché avec une ancre balise qui appelle une méthode javascript qui utilise jQuery pour obtenir l'élément et exécuter un clic (). Cela fonctionne correctement, les écritures de formulaire et l’enregistrement ont bien été écrits dans la base de données.

Alors maintenant, j'ai ajouté xVal pour validation. J'essaie d'ajouter une simple validation côté client.

Cela ne fonctionne pas lorsque je clique sur la balise d'ancrage. Cependant, si je désactive le bouton d'envoi et que j'essaie de poster le formulaire avec celui-ci au lieu d'utiliser la balise d'ancrage appelée la méthode js, cela fonctionne. Donc, fondamentalement, j'essaie de comprendre pourquoi cela ne fonctionne pas lorsque j'utilise la méthode js pour déclencher le clic du bouton d'envoi.

Des grandes idées? Merci beaucoup!

Voici du code ...

<div id="manufacturerButtons" class="moduleRow">
            <%= Html.ActionImage(Url.Content("~/Content/Icons/bullet_go_back.png"), "Back To Admin", "Admin", "Admin")%>
            | <a class="actionImage" href="javascript: addManufacturer();">
                <img border="0" src="<%= Url.Content("~/Content/Icons/accept.png")%>">&nbsp;<span>Add
                    Manufacturer </span></a>
        </div>
        <div class="moduleContent">
            <div id="manufacturerContainer">
                <div class="moduleRow">
                    <h3>
                        New Manufacturer</h3>
                </div>
                <div class="moduleRow">
                    <% Html.BeginForm("NewManufacturer", "Admin", FormMethod.Post); %>
                    <table class="noBorder" border="0" cellpadding="0" cellspacing="0">
                        <tr>
                            <td style="width: 125px">
                               <h6>Name:</h6>
                            </td>
                            <td>
                                <%= Html.TextBox("Name") %>
                            </td>
                        </tr>
                        <tr style="display: none;">
                            <td>
                                &nbsp;
                            </td>
                            <td>
                                <input type="submit" id="btnAdd" name="btnAdd" />
                            </td>
                        </tr>
                    </table>
                    <% Html.EndForm(); %>
                    <%= Html.ClientSideValidation<EquipmentManufacturer>() %>
                </div>

            </div>

Javascript:

function addManufacturer() {
    //$('form').submit(); // doesnt work when trying to validate either
    $('#btnAdd').click();
    return true;
}
Était-ce utile?

La solution

Ce que vous devez faire, c'est déclencher la validation de jQuery sur votre formulaire. Essayez:

$('form').validate();

Pour soumettre le formulaire une fois la validation effectuée, essayez:

$('form').validate({ submitHandler: function(form) { form.submit(); } });

Notez que 'formulaire' doit être un sélecteur jQuery valide pour votre formulaire ...

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top