[jQuery] simple wizard: stuck with first jquery usage
Hi,
I would like to make a simple wizard. I have gotten as far as hiding all
divs aside from the first, and inserting the next and back buttons. I'm
having problems assigning click function to next/back
next should hide current div and revel next div
back hides current and revels previous
markup (simplified):
<div id="content">
<div class="step-one"><form></form></div>
<div class="step-two"><form></form></div>
<div class="step-three"><form></form></div>
</div>
jquery:
$(document).ready(function() {
// assign buttons to divs
$('#content div:not(:first)').hide();
// hide divs
//$('div.step-two').hide();
//$('div.step-three').hide();
// insert buttons
var next = $(' #next Next ');
var back = $(' #back Back ');
$(next).insertAfter('#content div[class*=step]:not(:last) form');
$(back).insertAfter('#content div[class*=step]:gt(0) form');
//wizard functionality
$(next).click(function () {
$('div.step-one').hide(); });
/*$('div.step-two a.next').click (function () {
$('div.step-two').hide();
$('div.step-three').show();
});
$('div.step-two a.back').click (function () {
$('div.step-one').show();
$('div.step-two').hide();
});
$('div.step-three a.back').click (function () {
$('div.step-two').show();
$('div.step-three').hide();
}); */
});
I've left my initial script where I was calling out each div...issue is,
number of divs is uncertain, so script needs to take that into factor and
not call out each click function as I was doing.
Any help, any modification truly welcome. I'd like to keep it as
progressively enhanced as possible; hence hiding divs from js and inserting
next/back via DOM.
Thanks.
--
View this message in context: http://www.nabble.com/simple-wizard%3A-stuck-with-first-jquery-usage-tp19591708s27240p19591708.html
Sent from the jQuery General Discussion mailing list archive at Nabble.com.