Question

Im thinking about implementing this multistep wizard discussed in ryan bates railscast. http://railscasts.com/episodes/346-wizard-forms-with-wicked

Im wondering how i could implement a progress meter such as the ones that you typical see in jquery wizards such as http://www.jankoatwarpspeed.com/examples/webform_to_wizard/#.

Any ideas?

Thanks!

Answer 1

There are two main types of wizards.

The first.

This is exactly the one used in railscasts. In fact, you break one large form into several smaller ones. That is, you have a separate view for each form. Accordingly, you can write the current step in each of these views. You do not need to use jQuery plugins in this case.
For example, like in railscasts just add in top of:

#/app/views/user_steps/personal.html.erb
<p>STEP 1: <b>Tell us a little about yourself</b></p>
<p>STEP 2: Where can we find you?</p>

#/app/views/user_steps/social.html.erb
<p>STEP 1: Tell us a little about yourself</p>
<p>STEP 2: <b>Where can we find you?</b></p>

And the second.

This is a one big form, which is shared by several small. This is what you show as the example. For this form, you do not need use wicked, because the jQuery plugin doing all work by self. At the end of the steps you just send this big form on the server.

The problem with jQuery wizard in the validation of the form: you send the form on the last step, but errors may occurs in the previous steps. This problem can partly solve by the client side validation: https://github.com/bcardarella/client_side_validations