CODEWITHSUNDEEP
jqueryhtml
Mathematics
Mathematics

Reputation: 7618

Get text from label using jQuery

Code

var $eContainer = $('<div/>', { id: "eContainer", class: 'eList' }).appendTo($injectTo);
    for (var i in navProps) {
        var np = navProps[i];
        var npName = np.name;
        var npId = containerId + "_" + npName;

        var $eLabel = $('<label />', { 'for': npId, text: npName }).appendTo($eContainer);
        $('<input />', { type: 'checkbox', id: npId, value: npName }).prependTo($eLabel);
    };

Output

<label for="e_22">
    <input type="checkbox" id="selectcolumn_16" value="22">Supplier<div id="eContainer" class="eList">
            <label for="a">
                <input type="checkbox" id="a" value="A">AAA</label>
                <label for="b">
                    <input type="checkbox" id="b" value="B">BBB</label>
                                    </div>
                                </label>

Problems

Code for 2nd problem

// Event handler for adding labels.
this.$eList.on('click', ':input', $.proxy(function (event) {
    var $e = $(event.target);
    var selectedLabel = $e.parent().text();
    // here it should return "Supplier" when I click on it, but it returns
    // SupplierAAABBB -- which is WRONG

Edit

Please don't provide solution with hard code, as I need to make it work dynamically, so it must need to get it from parent, there will several hierarchies of these div's and controls

Upvotes: 2

Views: 11127

Answers (4)

ndrewxie
ndrewxie

Reputation: 172

You could do this:

theLabel = $("#labelId");
theLabel.text(); //gets text

The only reason why my answer is different than developer's answer is that my answer stores your label in a var - you don't have to keep getting it using $() each time.

Upvotes: 0

Michael J
Michael J

Reputation: 1

var myLabelValue = $('label').html();

Upvotes: -1

Kalu Singh Rao
Kalu Singh Rao

Reputation: 1697

You can get text from label using this code.

var lbltxt = $('#labelid').text();

Upvotes: 5

guradio
guradio

Reputation: 15555

var text = $("label[for=e_22]").contents().filter(function() {
  return this.nodeType == 3;
}).text();

console.log(text.trim())
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<label for="e_22">
  <input type="checkbox" id="selectcolumn_16" value="22">Supplier
  <div id="eContainer" class="eList">
    <label for="a">
      <input type="checkbox" id="a" value="A">AAA</label>
    <label for="b">
      <input type="checkbox" id="b" value="B">BBB</label>
  </div>
</label>
1. Use the nodeType where 3 is equal to text node

Upvotes: 2

Related Questions