CODEWITHSUNDEEP
javascriptjquery
ramkumar-yoganathan
ramkumar-yoganathan

Reputation: 2168

How do I traverse one level up and search the html label and get the text?

How do I search one level up from the table td cell and find the label text.

Html Code:

<html>
<body>
<table>
<tr id="cmpnyDetailRow" class="ui-widget-content ui-panelgrid-even" role="row">
    <td id="cmpnyLblCol" role="gridcell" style="text-align:right;">
        <label id="cmpnyLbl" class="ui-outputlabel ui-widget outputmandatory">Company Name:</label>
    </td>
    <td id="cmpnyNameCol" role="gridcell">
        <input id="companyName" name="companyName" class="outputLabel" onchange="this.value = this.value.trim()" type="text">
    </td>
    <td id="cmpnyCityCol" role="gridcell" style="text-align:right;">
     <label id="cmpnyCityLbl" class="ui-outputlabel ui-widget outputmandatory">City/Town:</label>
    </td>
    <td id="cmpnyCity" role="gridcell">
        <input id="city" name="city" class="outputLabel" onchange="this.value = this.value.trim()" type="text">
    </td>
   </tr>
</table>

Solution tried:

$('#city').prev('td').find("label").text();

I unable to find, what is wrong in the code?

Another Situation:

<tr>
    <td>
        <label for="loginForm:j_username" style="text-align: right;font-size: 17px;" class="value-bold_new">User ID</label>
     </td>
</tr>
<tr>
    <td>
        <input id="loginForm:j_username" name="loginForm:j_username" value="[email protected]" style="width:257px;height:36px;font-size: 15px;" tabindex="1" onchange="this.value = this.value.trim()" type="text">
    </td>
</tr>

Does this code work?

$(document.getElementById('loginForm:j_username')).parent().prev('td').parent().prev('tr').find('label').text();

Nevertheless, I solved it.

$(document.getElementById('loginForm:j_username')).parent().parent().prev('tr').find('label').text();

Upvotes: 1

Views: 157

Answers (2)

Code Lღver
Code Lღver

Reputation: 15603

Try this:

$('#city').parent().prev('td').find("label").text();

add parent() function after city.

How it will work:

You have select the city element than you need to select he td by using the parent function and than it will reach to previous or next td.

Look at this link: parant function in jquery.

Upvotes: 1

Nenad Vracar
Nenad Vracar

Reputation: 122027

You need to first select parent element of input DEMO

$('#city').parent().prev().find('label').text()

Upvotes: 1

Related Questions