Click here to Skip to main content
15,886,362 members
Please Sign up or sign in to vote.
4.00/5 (2 votes)
See more:
Hello all,

I'm using some javascript to get the field values of a form and to check if they are empty or not:
if(document.getElementById('FIELD').value=='')
Then I'm interested on getting the associated label to that text FIELD...

It should be something like:
document.getElementById('FIELD').label


In the PHP side I've done this:
XML
$str .= '<td class="ft1"><LABEL for="FIELD" ACCESSKEY="none" ><b style="color:#ff6d00">* THIS IS THE LABEL TEXT I WANT TO READ IN JAVASCRIPT</b></td>';
$str .= '<td class="ft2"><select name="FIELD" id="FIELD">';


I've not been able to get it working and truly I don't know where to search...

Anyone here knows it?

Thank you in advance.
Posted
Updated 9-Jun-11 7:39am
v3
Comments
aidin Tajadod 9-Jun-11 12:42pm    
Hi Joan, I am not PHP programmer, but If you put an ID for your label (ex lblField), you can get or set it via jQuery by $("#lblField").html()

hope this can help you.
Joan M 10-Jun-11 13:08pm    
Thank you aidin! I've used the solution that Ed has posted (see below) that is using somehow your advice. :thumbsup:
aidin Tajadod 10-Jun-11 20:00pm    
you are welcome.

The first part of aidin Tajadod comment is good - the easiest way for you to do this is by giving your label an Id. However, though I would strongly advise you look at doing this using jQuery before you go too far with it, if you want to do it old school you should use something like this:

XML
$str .= '<td class="ft1"><LABEL id="Field_Label" for="FIELD" ACCESSKEY="none" ><b style="color:#ff6d00">* THIS IS THE LABEL TEXT I WANT TO READ IN JAVASCRIPT</b></td>';
$str .= '<td class="ft2"><select name="FIELD" id="FIELD">';


JavaScript
var LabelId = "Field_Label";

//This will get the innerHTML of the first child (in your case the <b> tag) if it is present, if not just the innerHTML of the label:
var LabelElem = document.getElementById(LabelId);
var LabelText = LabelElem.childNodes.length > 0 ? LabelElem.childNodes[0].innerHTML : LabelElem.innerHTML;
if(LabelText == '')
{
    //Do something
}
else
{
    //Do something different
}


In jQuery this would be something like:
JavaScript
var LabelId = "Field_Label";

//This will get the innerHTML of the first child (in your case the <b> tag) if it is present, if not just the innerHTML of the label:
var LabelElem = $("#" + LabelId);
var LabelText = LabelElem.children().length > 0 ? LabelElem.children().get(0).text() : LabelElem.text();
if(LabelText == '')
{
    //Do something
}
else
{
    //Do something different
}

This looks longer but because of the guys at jQuery, it is faster :D

You should improve either of the codes above for getting the relevant text to suit your specific needs but it is a good general start.

Hope this helps,

Ed :)
 
Share this answer
 
Comments
aidin Tajadod 9-Jun-11 14:59pm    
Hi EdMan, I have not tested your solution but it should work. I just did not get what is wrong with $("ID").html() ?
thanks.
Ed Nutting 9-Jun-11 15:42pm    
jQuery uses selectors so to get elements with a particular Id you must use the CSS '#' selector thus it would need to be $("#ID") and .text() or .html() - either will do. Also, the example given contained a bold tag, thus calling .text()/.html() would return <b ...>Some text</b> rather than just the text - not what the OP wanted necessarily. Thus search for a child tag element (the bold tag in this case) and return the text of that or return text of label if there are no child elements. Hope this clears things up, Ed :)
aidin Tajadod 9-Jun-11 16:15pm    
Thanks EdMan, I did not notice <b...> inside the label. you are right. thanks for your time and explanations.
Ed Nutting 9-Jun-11 16:32pm    
That's okay :) Glad I could help :)
Joan M 10-Jun-11 13:10pm    
Ed! it works wonderfully ok! I've been able to do it so now I don't have to re-parse the database to get the name translations again. (Avoiding to give access to the database to another PHP file) ^^ so it works, it is easy and it is fast. Thank you for answering so fast! :thumbsup: + 5ed!
You can find the label without giving it an ID by doing this:
JavaScript
var labels = document.getElementsByTagName('label'), l, label;
for(l in labels) {
  if(labels[l]['htmlFor'] == 'FIELD') { 
    // found it...
    label = labels[l];
  }
}


... then traverse the DOM to grab the contents of the <b> tag as EdMan196 said in his answer.
 
Share this answer
 
Comments
Ed Nutting 9-Jun-11 14:52pm    
Reasonable answer but extremely inefficient as soon as he has more than a few labels. Id would be far better. My 4, Ed :)
Joan M 10-Jun-11 13:07pm    
Graham, I've tried it and it works, but it takes time to create it... here to create id's is not an issue as they are created using loops and as Ed says I have plenty of them so I prefer his solution, anyway thank you very much for your rapid response. :thumbsup:
Graham Breach 10-Jun-11 14:17pm    
Fair enough - this approach is most useful if you can't add ids to the labels, but Ed is right that it can be an awful lot slower when there are a lot of labels to check through.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900