Solved

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

Posted on 2013-11-16
5
738 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
Comment Utility
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
Comment Utility
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 42

Assisted Solution

by:Chris Stanyon
Chris Stanyon earned 125 total points
Comment Utility
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
Comment Utility
<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
Comment Utility
Thank you, fellows. All that info helped. I was just reading the doc on .closest and I forgot about this function.
0

Featured Post

IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

Join & Write a Comment

Suggested Solutions

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 …
Boost your ability to deliver ambitious and competitive web apps by choosing the right JavaScript framework to best suit your project’s needs.
The viewer will learn how to dynamically set the form action using jQuery.
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)

771 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

10 Experts available now in Live!

Get 1:1 Help Now