CODEWITHSUNDEEP
javascriptjqueryjquery-selectors
dinchakpianist
dinchakpianist

Reputation: 217

How do I select the next "select" (dropdown) in this HTML?

My html is:

    <tr>
        <td><select id = "delAppSelectApp" name="delAppSelectApp"><option value="--Select--"> --Select--</option></select></td>
        <td><select id = "delAppSelectAppVers" name="delAppSelectAppVers"><option value="--Select--">--Select--</option></select></td>
        <td><input type="submit" name="submitDelAppVers" id="submitDelAppVers" value="Delete Application Version" /></td>
    </tr>

My script is:

$(document).ready(function(){
    $("#delAppSelectApp").change(function(){
        alert( $(this).nextAll("select").attr("id") );
    });
});

I want the window to alert "delAppSelectAppVers", which is not happening. What am I doing wrong ? I've even tried the "siblings" function.

Upvotes: 2

Views: 522

Answers (2)

Joseph Silber
Joseph Silber

Reputation: 220146

$(document).ready(function() {
    $("#delAppSelectApp").change(function() {
        alert( $(this).closest("td").next().find('select').attr("id") );
    });
});

Here's a demo: http://jsfiddle.net/7twmJ/

Upvotes: 3

Mad Man Moon
Mad Man Moon

Reputation: 739

It's not working because the there is no "next" element (sibling) at the same level within the node xpath/axis. Try this:

$(this).parent.next().children("select:first").attr("id")

Upvotes: 1

Related Questions