Questions tagged [jquery-steps]

jQuery Steps is a smart UI component which allows you to easily create wizard-like interfaces. This plugin groups content into sections for a more structured and orderly page view.

Homepage

http://www.jquery-steps.com/

Docs

https://github.com/rstaib/jquery-steps/wiki

Examples

http://www.jquery-steps.com/Examples

Syntax

$("#example-basic").steps({
  headerTag: "h3",
  bodyTag: "section",
  transitionEffect: "slideLeft",
  autoFocus: true
});
<div id="example-basic">
  <h3>Keyboard</h3>
  <section>
    <p>Try the keyboard navigation by clicking arrow left or right!</p>
  </section>
  <h3>Effects</h3>
  <section>
    <p>Wonderful transition effects.</p>
  </section>
  <h3>Pager</h3>
  <section>
    <p>The next and previous buttons help you to navigate through your content.</p>
  </section>
</div>
236 questions
27
votes
16 answers

Going to a custom step with jQuery-steps

I am using a jQuery-steps on my app to for a wizard-like situation. I am having trouble finding out how to change to a custom step though. Any help with this one? $(function () { $("#wizard").steps({ headerTag: "h2", bodyTag:…
Capuchin
  • 3,465
  • 6
  • 28
  • 40
21
votes
11 answers

jQuery wizard steps move before ajax call completed

How can I control the move to next step according to the result of some ajax call?? the data.d returns with a bool value $("#wizard").steps({ onStepChanging: function (event, currentIndex, newIndex) { var move = false; …
heeema
  • 223
  • 1
  • 3
  • 7
15
votes
7 answers

How to set a dynamic height on content for each step?

I'm using Jquery steps wizard plugin. The problem I am having is that each step of the wizard has content of a different height. The css included with the examples to control the height for the content is .wizard > .content { background: #eee; …
sfuptown
  • 277
  • 1
  • 5
  • 14
13
votes
4 answers

Changing the name of a button in jquery-steps

I have included the jquery-steps plugin. How can I change the buttons texts? Now it says "finish" I want to change that into "go" Thanks
Brampage
  • 6,014
  • 4
  • 33
  • 47
11
votes
1 answer

Select2 not working in Jquery-Steps

I installed Jquery-steps plugin and select2 plugin. I put select2 box inside the Wizard form (jquery-steps) and it doesn't work. The list values are not exported in . Outside the wizard select2 works fine.
DecoderNT
  • 1,054
  • 10
  • 19
8
votes
1 answer

Nested jQuery Steps - Nothing displays on Main Next

I have a simple html form with nested jQuery steps. The Main wizard has 5 steps and the 3rd step has a sub wizard containing 3 steps. When clicked on "Next" of main wizard, step is moved and the content is displayed but after the 3rd step (the one…
Consult Yarla
  • 1,150
  • 10
  • 22
8
votes
7 answers

jQuery Steps - reset wizard without page reload

I am using jQuery steps ( https://github.com/rstaib/jquery-steps/wiki ) in order to create step by step form to users to fill out. It works great, however I need to be able to reset it. Once user submitted the form (using ajax so the page doesn't…
MeIr
  • 7,236
  • 6
  • 47
  • 80
6
votes
4 answers

Removing Previous Button on First Step jQuery Steps

I'm using jQuery Steps for my site signup wizard, works awesome with the exception that on the first step I'm getting the previous button, which really makes no sense since there is no previous content. I looked at the onInit() function in the API…
secondman
  • 3,233
  • 6
  • 43
  • 66
6
votes
6 answers

How do I get the current step in jQuery steps wizard?

I'm looking for a way to get the current step in my jQuery Steps wizard. I would like to perform an action if the current step is step 1.
PaulG
  • 6,920
  • 12
  • 54
  • 98
6
votes
1 answer

jQuery steps won't render correctly

The HTML: TEsT
kmansoor
  • 4,265
  • 9
  • 52
  • 95
6
votes
3 answers

jquery-steps | send data to server on ajax content load

I'm using: http://www.jquery-steps.com/Examples#async in my project. It's a nice Jquery-plugin for adding wizards. My question is about dynamic steps. The content of the next step should depend on the answer of the previous step. How can I send…
user2779014
  • 65
  • 1
  • 1
  • 3
5
votes
2 answers

Using API to change settings in jquery-steps

How do I change the settings in query-steps using the API? I'm trying enable all the steps if I am in an Edit mode for a form. I tried using: var wizard = $("#wizard").steps(); wizard.steps({ enableAllSteps: true }); Apparently this…
Steve Loo
  • 276
  • 1
  • 5
  • 12
5
votes
2 answers

Form Validation on Jquery-steps: undefined is not a function on .validate() function

I don't understand whats going on. Im trying to implement the form validation with the Jquery-steps and when I click the next button, my form should be validated. But it is not and it is returning an error on validate function. Here is my…
Terinah14
  • 153
  • 1
  • 2
  • 13
4
votes
1 answer

JQuery steps: How to show/hide an additional step based on user input

I am using jquery-steps to create an "interactive" two/three step form. One thing I am trying to achieve is to show/hide an additional step after step 2 (which would normally be the final step) which would be the new final step based on the value of…
Codingmedic
  • 55
  • 1
  • 1
  • 8
4
votes
1 answer

How to change width of tabs in jQuery Steps Plugin

I am using jQuerySteps Plugin to create tabs. I have four section and thus 4 tabs and they work prefectly fine. But I want each tab to have different percent of width. As of now each of them gets 25%. But I want to manually assign them the width. I…
Unbreakable
  • 7,776
  • 24
  • 90
  • 171
1
2 3
15 16