Comment valider un formulaire de connexion avec jQuery?

Quelqu'un peut-il me dire comment faire pour valider un formulaire de connexion avec le jQuery Valider plugin?

J'ai essayé ce code:

    <script src="jquery-1.8.3.js"></script>
<script src="loginbut/js/login.js"></script>
<script src="jquery.validate.js" type="text/javascript">
</script>
<script>
$(document).ready(function(){
$("#loginform").validate({
rules:{
//name:"required",
username:"required",

password:"required",
gender:"required",

},
messages:{
email:"This field cannot be empty",

password:{
required:"specify password",

},

});

});


</script>

et html code:

<div id="bar">
    <div id="container">
        <!-- Login Starts Here -->
        <div id="loginContainer">
            <a href="#" id="loginButton"><span>Login</span><em></em></a>
            <div style="clear:both"></div>
            <div id="loginBox">                
                <form id="loginForm">
                    <fieldset id="body">
                        <fieldset>
                            <label for="email">Username</label>
                            <input type="text" name="email" id="email" class="required"/>
                        </fieldset>
                        <fieldset>
                            <label for="password">Password</label>
                            <input type="password" name="password" id="password" class="required"/>
                        </fieldset>
                        <input type="submit" id="login" value="Sign in" />
                        <label for="checkbox"><input type="checkbox" id="checkbox" />Remember me</label>
                    </fieldset>
                    <span><a href="#">Forgot your password?</a></span>
                </form>
            </div>
        </div>
        <!-- Login Ends Here -->
    </div>
</div>

De Validation ne fonctionne pas.

Merci de m'aider.

InformationsquelleAutor user1944933 | 2013-01-05
  1. 5

    Il ne fonctionne pas parce que vous avez une multitude de syntaxe et les erreurs de mise en forme. Le validate() plugin utilise la name attribut sur input champs. Vos deux champs à l'aide de email et password pour leur name attribute. Je ne sais même pas pourquoi votre fonction contient gender, car il n'est pas contenue dans le HTML, n'importe où que je peux voir.

    Votre code a de nombreux problèmes:

    • manque une accolade de fermeture, }
    • vous n'avez pas un champ nommé "gender", j'ai donc supprimé cette règle.
    • username:"required", n'est pas typique de format pour cette règle. Devrait être required: true,
    • mal de ciblage "username" lorsque le champ est name attribut est "email"
    • que vous avez mal orthographié #loginForm dans votre jQuery code
    • vous n'avez pas besoin class="required" dans le input si vous allez spécifier des règles au sein de l'jQuery, donc de le supprimer à partir de votre code HTML.
    • beaucoup de "virgules" de retirer ce qui va provoquer des problèmes dans certaines versions de l'Explorateur de

    Juste un conseil: Beaucoup de vos erreurs de syntaxe serait beaucoup plus facile à repérer quand le code est correctement indenté.

    En supposant que le code HTML de votre form est correct, votre jQuery devrait ressembler à ceci:

    $(document).ready(function(){

    $("#loginForm").validate({
        rules: {
            email: {
                required: true
            },
            password: {
                required: true
            }
        },
        messages: {
            email: {
                required: "specify email"
            },
            password: {
                required: "specify password"
            }
        }
    });

});

    De Travail De Démonstration:

    http://jsfiddle.net/fYdkL/1/

    Documentation:

    http://docs.jquery.com/Plugins/Validation

    Officiel Exemples:

    http://jquery.bassistance.de/validate/demo/

    • Merci beaucoup..j'ai corrigé mes erreurs. il fonctionne parfaitement maintenant.
    InformationsquelleAutor Sparky