?
Solved

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

Posted on 2013-11-16
5
Medium Priority
?
820 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
[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
5 Comments
 
LVL 58

Assisted Solution

by:Gary
Gary earned 500 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 500 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 500 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 500 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

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

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…
Introduction JSON is an acronym for JavaScript Object Notation.  It is a text-string data transport mechanism, capable of representing simple or complex data structures in a consistent and easy-to-read manner.  Similar in concept to XML, but more e…
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…
Suggested Courses

765 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