Solved

jquery: search for first occurence of <label> tag that is in parents()

Posted on 2013-11-16
5
753 Views
Last Modified: 2013-11-17
Hi,

I'm wondering how I can find the first occurrence of the <label> tag that is in .parents().

For example, I have this code:

 var oSelected = $('form select option:selected');

And suppose I have a <label> html that occurs before the <select><option> but I may have a <span> or a <div> between the <label> and <select><option> tags. How would find the <label> from the variable oSelected using jQuery? Then I need to find the value of the "for" attribute of this <label> tag.

I have the $selected in a loop using .each() like so:

oSelected.each(function(index, value) {
   oSelectedValues['title'] = $(this).parent().prev().attr("for");
   (more code)
});

I have the above code that works now but it only works IF I have the <label> right before the <select>. If there is anything in between the <label> and the <select> it won't work. For example, if I have <label></label><span></span><select><option></option></select> it won't work.

Thanks
0
Comment
Question by:Victor Kimura
5 Comments
 
LVL 58

Assisted Solution

by:Gary
Gary earned 125 total points
ID: 39653548
What is the real markup of your code, an example layout is no good if it is nothing like your real markup. e.g. for your example above you could just do

$(this).prev().prev().attr("for")
0
 
LVL 44

Accepted Solution

by:
Rainer Jeschor earned 125 total points
ID: 39653739
Hi,
as long as you have no container element like DIV or SPAN around your label / select box combination, it will be hard (to impossible) to create a selector for the right element.

And as GaryC123 already mentioned, please attach the real DOM / HTML source.

So if you have a structure like
<div><label/><span/><select/>

Open in new window

then this selector is able to get the element
$(this).closest("div").find("label")

Open in new window


HTH
Rainer
0
 
LVL 43

Assisted Solution

by:Chris Stanyon
Chris Stanyon earned 125 total points
ID: 39653893
Agree with the others. Without seeing your document, can't really be specific, but if the label that you're looking for is linked to the SELECT, then the 'for' attribute will be the same as the ID of the SELECT- why not just grab the ID of the select.
0
 
LVL 82

Assisted Solution

by:leakim971
leakim971 earned 125 total points
ID: 39653995
<label for="myselect"></label><span></span><select id="myselect"><option></option></select>

test page : http://jsfiddle.net/HUC5x/

var oSelected = $('form select option:selected');
var selectID = oSelected.parent().attr("id");
var label = $("label[for='" + selectID + "']");

//checking
alert( label.text() );

Open in new window

0
 

Author Closing Comment

by:Victor Kimura
ID: 39655438
Thank you, fellows. All that info helped. I was just reading the doc on .closest and I forgot about this function.
0

Featured Post

Is Your Active Directory as Secure as You Think?

More than 75% of all records are compromised because of the loss or theft of a privileged credential. Experts have been exploring Active Directory infrastructure to identify key threats and establish best practices for keeping data safe. Attend this month’s webinar to learn more.

Question has a verified solution.

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

Introduction If you're like most people, you have occasionally made a typographical error when you're entering information into an online form.  And to your consternation, the browser remembers the error, and offers to autocomplete your future entr…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

911 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

Need Help in Real-Time?

Connect with top rated Experts

19 Experts available now in Live!

Get 1:1 Help Now