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>

235 questions
2
votes
2 answers

Dynamically create steps for jQuery Steps

I am having some trouble dynamically creating some steps using the jQuery Step Wizard plugin. Here is my code: Demo
2
votes
1 answer

Jquery Steps Wizard Select List Validation

I am using a jQuery plugin called steps to create a form wizard. Which can be used in conjunction with the jQuery validation plug in. I need to be able to validate a select list before the user proceeds to the next set of options but I haven't found…
1
vote
0 answers

How to combine `async:false` and `beforeSend` in AJAX?

I have an AJAX that need to have async:false and beforeSend function to work together. I have to enable loading spinner before AJAX call and stop the spinner after AJAX done, But I also set to async:false to next the step after AJAX done. I am using…
Vahn
  • 540
  • 1
  • 7
  • 24
1
vote
1 answer

how to validate my input type radio in my Multistep form? When I click Next Then its forworded to next step

I am using the multistep form and I want to prevent input radio in step form if the radio is not selected then not forward another step. My input type of text is validated. allNextBtn.click(function(e) { e.preventDefault(); …
1
vote
1 answer

Jquery validation not working for second row in table

Issue Details I am adding the rows dynamically. Code is inside JQuery steps. Jquery validation is working on first row in table but not on second row in table. I meant, when I click next without typing anything, it shows the tab as red color. But…
Pankaj
  • 8,971
  • 23
  • 105
  • 242
1
vote
1 answer

How can jquery steps pagination button's position change in modal

I have a modal and i use jquery steps inside it. I want to change steps's buttons prev next and submit position to inside modals footer. I tried to solve it appending button's div to inside modal footer but buttons didn't work. How can i solve it ? …
Trinity
  • 436
  • 5
  • 21
1
vote
2 answers

Uncaught TypeError: $(...).steps is not a function

So I saw really good looking forms in my bootstrap template and I wanted to use them in my project. I placed all the required files that I think we need to import which are added at the bottom of the code, required files are in the correct…
S0ul3r
  • 131
  • 1
  • 8
1
vote
0 answers

Add steps actions button in my bootstrap modal footer

I tried to create a form wizard using the jQuery Steps library, but I can't change the button position. I want to use my own modal buttons for the wizard, but the steps library adds its own button actions just after the form in the modal-body. This…
1
vote
0 answers

Go to a div with jquery steps

I am using some jquery steps plugin on my page. Whit this code, i can go to the next or the previous div. If i click the #modify_contact button, how can i go to the #step-2 div? I dont copy the html oce, because its just divs with id-s, nothing…
max777
  • 133
  • 2
  • 14
1
vote
0 answers

How to use Croppie in steps js or tab js? It dosn't work in steps js

I need to use Croppie Js for upload and crop image in Steps Js. But it doesn't work. when I disabled Steps it works correctly. I dont know what is the problem. I test it in Bootstrap Modal too, but it doesn't work neither. Could you please check the…
Camelia
  • 93
  • 7
1
vote
0 answers

Jquery Steps Reload Current Async Page

I am trying to reload the current step that I am on. I have 3 steps and I need to reload the page after making changes within it. I am using the async steps so it loads a url on each step. In the https://github.com/rstaib/jquery-steps/wiki I am…
Jed
  • 829
  • 2
  • 13
  • 29
1
vote
1 answer

Submit on step change in jQuery Steps

Here's the chunk of the code I have: $("#test-wizard").steps({ headerTag: 'header', bodyTag: '.container', transitionEffect: "slideLeft", autoFocus: true, onStepChanged: function(event, currentIndex) { …
Murakami
  • 1,996
  • 4
  • 20
  • 49
1
vote
1 answer

jQuery validation for multiple input fileds

I have 4 input fields as below screen. Code is below.
Sumith Harshan
  • 5,750
  • 2
  • 33
  • 34
1
vote
1 answer

jQuery Steps - reset to the main step

I have referred to these links for resetting to first step, but didn't help. jQuery Steps - reset wizard without page reload How to add a "reset" button to JQuery-steps jQuery Form Plugin API I have added custom Submit button on the last step.…
Keyur
  • 980
  • 1
  • 20
  • 38
1
vote
1 answer

How do I return the result of an AJAX call from jQuery.steps?

I know a very similar question was asked and answered here, but the answer there doesn't work for me. I don't know if I'm doing something wrong, or if there has been a change in either jQuery or jQuery.steps in the last 18 months. In the…
DreamingOfSleep
  • 617
  • 1
  • 4
  • 15