?
Solved

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

Posted on 2015-01-27
4
Medium Priority
?
500 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 2000 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

Free Tool: Site Down Detector

Helpful to verify reports of your own downtime, or to double check a downed website you are trying to access.

One of a set of tools we are providing to everyone as a way of saying thank you for being a part of the community.

Question has a verified solution.

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

When the s#!t hits the fan, you don’t have time to look up who’s on call, draft emails, call collaborators, or send text messages. An instant chat window is definitely the way to go, especially one like HipChat. HipChat is a true business app. An…
In this blog, we’ll look at how improvements to Percona XtraDB Cluster improved IST performance.
This tutorial walks through the best practices in adding a local business to Google Maps including how to properly search for duplicates, marker placement, and inputing business details. Login to your Google Account, then search for "Google Mapmaker…
The viewer will get a basic understanding of what section 508 compliance can entail, learn about skip navigation links, alt text, transcripts, and font size controls.
Suggested Courses

770 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