brauche jquery.validate ohne absenden

Ich habe einige der anderen Posts darüber gelesen und bin immer noch nicht gegangen. Ich versuche es wirklich einfach zu halten. Ich muss Abschnitte eines Formulars validieren, die in einem jQuery-Akkordeon ausgeblendet / angezeigt werden, bevor ich es endgültig abschicke. Ich habe verwendetjquery.validate.js für eine lange Zeit und solange ich am validierensubmit alles ist gut, aber jetzt, wenn ich versuche, auf Knopfdruck zu validierenclick es funktioniert nicht.

    <script type="text/javascript">
jQuery().ready(function(){
    var demo = $(".demo").accordion({
        header: '.header',
        event: false
    });

    var nextButtons = $([]);
    $("h3.header", demo).each(function(index) {
        nextButtons = nextButtons.add($(this)
        .next()
        .children(":button")
        .filter(".next, .previous")
        .click(function() {
            demo.accordion("activate", index + ($(this).is(".next") ? 1 : -1))
        }));
    });

});
</script>
<script type="text/javascript">

$(".next").click(function(){
$("#test").validate({              
     rules: {
                     name: "required", // simple rule, converted to {required:true}
                     email: {// compound rule
                         required: true,
                         email: true
                     },
                     comment: {
                         required: true
                     }
                 },
                 message: {
                     comment: "Please enter a comment."
                 }
             });


});
</script>
    <div class="demo">
<form action="#" method="post" id="test">
  <fieldset>
<div id="accordion">
    <h3 class="header"><a href="#">Section 1</a></h3>
    <div class="sec1">
    <label for="name">Name:</label>
    <input type="text" id="name" placeholder="Enter your 
full name" class="required" />
<input type="button" class="next" value="NEXT" />
    </div>
    <h3 class="header"><a href="#">Section 2</a></h3>
    <div class="sec2">
    <label for="email">Email:</label>
    <input type="email" id="email" placeholder="Enter 
your email address" class="required" />
<input type="button" class="next" value="NEXT" />
<input type="button" class="previous" value="Previous"/>
    </div>
    <h3 class="header"><a href="#">Section 3</a></h3>
    <div class="sec3">
    <label for="message">Message:</label>
    <textarea id="message" placeholder="What's on your 
mind?" class="required"></textarea>
    <input type="submit" value="Send message" />
    <input type="button" class="previous" value="Previous"/>
    </div>
      </fieldset>
</form>

</div>
</div><!-- End demo -->

Antworten auf die Frage(1)

Ihre Antwort auf die Frage