Link to home
Start Free TrialLog in
Avatar of rivkamak
rivkamakFlag for United States of America

asked on

bootstrap tab opening wrong tab

I have a bootstrap tab on a form on my page.
http://du.thezone.org/apply.asp
if you leave the whole form blank, and just go to the last page and hit the finish button, after the alert message, it's supposed to bring me to the first tab again.
I tried both these methods which technically should work, but instead of showing me tab1 it's showing me tab2.
any idea what's wrong?
$('#rootwizard').find("a[href*='tab0']").trigger('click');

OR 

$('#rootwizard a[href="#tab1"]').tab('show');

Open in new window

Avatar of contactkarthi
contactkarthi
Flag of United States of America image

give a id='myTab' for your ul and use the following code and see

$('#myTab a:first').tab('show')
Credit to contactkarthi but the following works on your site (tested with the built in dev tools)

$('#rootwizard a:first').tab('show')
Avatar of rivkamak

ASKER

the concept makes sense, so how come it's on my page and it's still bringing me to the second tab.
not sure what you mean... I go to the last page and instead of clicking your submit, i open the dev tools (F12) and put the code below into the console and press enter.  Goes to the first tab.

code you post the submit / validation failed code?  Can you confirm you have

$('#rootwizard a:first').tab('show')
My validation script looks like this:
function verify() {
var themessage = "You are required to complete the following fields: ";
if (document.form1.Name.value=="") {
themessage = themessage + '\n' + "First Name";
}
if (document.form1.Name2.value=="") {
themessage = themessage + '\n' + "Last Name";
}
if (document.form1.Address.value=="") {
themessage = themessage + '\n' + "Address";
}
if (document.form1.City.value=="") {
themessage = themessage + '\n' + "City";
}

//alert if fields are empty and cancel form submit
if (themessage == "You are required to complete the following fields: ") {
document.form1.submit();
}
else {
alert(themessage);


$('#rootwizard a:first').tab('show') 
return false;
   }
}

Open in new window

line 24 above , you're missing a semicolon at the end of the line.
Doesn't help the problem.
Anything else?

It's almost like something else it triggering it to go to step 2.
is there something else i can use to get to tab1 instead of this code?
ASKER CERTIFIED SOLUTION
Avatar of Rob
Rob
Flag of Australia image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Somehow your answer made it work.
thank you
What it tells me is the trigger is happening after your code that you've displayed here. An outfit of execution issue.

By using the setTimeout function you're just delaying the execution of that function call. But it's masking the real issue.

I'll have a look at your code again to see if we can find the source if the issue