Формуляр от много части - jQuery

Разбирам, че това са страхотни добавки за автоматично създаване на формуляри от много части, но моето изискване е доста просто и основно:

html:

<form action="">
    <fieldset class="step step1">
        fields ...
        <button class="continue">Continue</button>
    </fieldset>
    <fieldset class="step step2">
        fields ...
        <button class="back">Back</button>
        <button class="continue">Continue</button>
    </fieldset>
    <fieldset class="step step3">
        fields ...
        <button class="back">Back</button>
        <button class="submit">Submit</button>
    </fieldset>
</form>

Искам да показвам само една стъпка полета наведнъж и да плъзгам (отляво надясно и обратно), като използвам бутоните за продължаване/назад.

Ще се радвам на всяка помощ.

Благодаря!


person eozzy    schedule 16.06.2010    source източник


Отговори (1)


$('.step1').siblings().hide(); // hide all except step 1

$('.continue').click(function(){
   $(this).closest('.step').hide().next('.step').show();
   return false;
});
$('.back').click(function(){
   $(this).closest('.step').hide().prev('.step').show();
   return false;
});

проста демонстрация

person Reigel    schedule 16.06.2010
comment
Страхотно! jQuery го прави да изглежда толкова лесно! ;) - person eozzy; 16.06.2010