Solved

How to get a form's ID for the selected jquery ui tab?

Posted on 2015-01-27
4
444 Views
Last Modified: 2015-02-02
Experts,

I have a jquery ui tab instance with several tabs. Each tab has a form with unique ID.

The following determines which jquery ui tab is selected:
var active = $("#tabs").tabs("option","active");

If a user clicks from tab 1 to tab 2, I need to be able to get the ID of the form on the selected tab.

The following attempts to get the <form> ID but only grabs the ID belonging to the first form on the first tab.

var form_id = $("form").attr('id');

If the user selects the second tab, I need to be able to identify the form's ID on this tab?

Thanks for the help!
0
Comment
Question by:evibesmusic
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 2
4 Comments
 
LVL 44

Expert Comment

by:Rainer Jeschor
ID: 40574136
Hi,
sorry i am on the road therefore no live example but a combination of your first line of code to get the active tab and then using this element as scope for the second selector:
var form_id = $("form",active).attr('id');
HTH
Rainer
0
 

Author Comment

by:evibesmusic
ID: 40574143
@Rainer Jeschor:

Thanks for the suggested code.

Using your suggestion the following code results in an alert that says "undefined" when viewing any other tab other than the first. It does successfully return the ID of the form on the first tab but, not when viewing any other tab.

var active = $("#tabs").tabs("option","active");
//GET ID OF FORM BEING SUBMITTED
var form_id = $("form",active).attr('id');
alert(form_id);
return false;
0
 
LVL 43

Accepted Solution

by:
Chris Stanyon earned 500 total points
ID: 40584398
Hey evibesmusic,

Your 'active' variable will not contain the actual tab, only a zero-based index (integer) of the selected tab, so you can't use that to filter the content. You'll need to use that index to get a reference to the actual tab content:

var active = $("#tabs").tabs("option","active"); //returns the index of the selected tab
var tab = $('#tabs .ui-tabs-panel').tabs()[active]; // uses the index to get the content of the active Tab
var formid = $("form",tab).attr('id'); // now you can filter the form from the content of the active tab

Open in new window

0
 

Author Closing Comment

by:evibesmusic
ID: 40585498
@Chris Stanyon:

Perfect! Thank you very much. Works as intended.
0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Title # Comments Views Activity
Problem evaluating javascript equality expression 8 18
PHP Web Development 6 28
DataTable column sorting incorrectly 2 22
Print a <div></div> only 5 39
Learn by example how to specify CSS selectors for Selenium WebDriver test automation software.
Does your audience prefer people in photos or no people? How can you best highlight what you’re selling? What are your competitors doing, and what can you do that is different and unique from them?  Continue reading to learn how to make your images …
Explain concepts important to validation of email addresses with regular expressions. Applies to most languages/tools that uses regular expressions. Consider email address RFCs: Look at HTML5 form input element (with type=email) regex pattern: T…
The viewer will learn how to count occurrences of each item in an array.

726 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question