Hi,
You could give all the divs a certain class, for example wizard. At
the beginning make that just one will be visible.
For the next and back you could find the index of the div which is
visible with this function $('.wizard').index($('.wizard:visible))
Then you just make it invisible and the next or previous invisible.
Just be aware of the corner cases where you don't have next and back
(first and last).
Good luck,
David
On Sep 21, 8:08 am, claudes <[EMAIL PROTECTED]> wrote:
> 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-...
> Sent from the jQuery General Discussion mailing list archive at Nabble.com.
