Open colapsnux opened 5 years ago
I should preface this by saying that I am a JavaScript newbie. I know this is old, but just in case it helps somebody else in the future, this was my solution to this problem:
options = $( element ).data( 'options' );
commands = {
- GotoStep: function( stepNo ) {
- var stepName = "step" + (--stepNo);
+ GotoStep: function( data ) {
+ var stepName = "step" + (--data.stepNo);
if( $( '#' + stepName )[ 0 ] === undefined ) {
- throw 'Step No ' + stepNo + ' not found!';
+ throw 'Step No ' + data.stepNo + ' not found!';
}
- if( $( '#' + stepName ).css( 'display' ) === 'none' ) {
- $( element ).find( '.stepDetails' ).hide();
- $( '#' + stepName ).show();
- selectStep( stepNo );
+ if( options.validateBeforeNext(data.element, $("#" + data.currentStep)) === true ) {
+
+ if( $( '#' + stepName ).css( 'display' ) === 'none' ) {
+ $( element ).find( '.stepDetails' ).hide();
+ $( '#' + stepName ).show();
+ selectStep( data.stepNo );
+ }
}
},
NextStep: function() {
This also required that I pass two extra parameters to the 'PreviousStrep' call:
$f.formToWizard("GotoStep", {stepNo: 2, element: $("form#formId"), currentStep: "step0"});
Where stepNo
is the step you want to go to, and step0
is the ID of the generated ID of the current step, zero index based.
I know, it's convoluted, but I don't know enought JS/jQuery to make it cleaner. Again, just sharing in case it helps somebody.
Never mind. I looked into it a little more and found a better solution. See #9.
You'll have to call it like this:
$f.formToWizard("GotoStep", "step0")
where step0
is the ID (without the #
) of the div to be validated. I can't find a way to automate it.
Is there a way where 'goToStep' can validate field before run to the desired step ? It work with 'PreviousStep' and 'NextStep' my field are validated and it doesn't continue if some field are not completed. Any function/tips for that it will work will be much appreciated Thanks in advance