Question

I’m trying to get the value of a <select> when a button is clicked. The <select> is directly about the button in the DOM, and I’m trying to use .closest()

My source is –

<div class="alignleft actions">
    <select id='bulk-action-selection' name='bulk-action'>
        <option value='-1' selected='selected'>Bulk Actions</option>
        <option value="delete" >Delete</option>
        <option value="open" >Open Polls</option>
        <option value="close" >Close Polls</option>
        <option value="recast_allow" >Allow Recasting</option>
        <option value="recast_deny" >Prevent Recasting</option>
        <option value="votes_show" >Show Votes</option>
        <option value="votes_hide" >Hide Votes</option>
    </select>
    <input type="submit" name="Submit" id="doaction" class="button-secondary action" value="Apply"  />
</div>

and the code that I am attempting to use is (returnin ‘undefined’ –

$('#doaction').click(function(e){
    action = $(e).closest('select').val();
});

Please help in getting the code to work (or suggesting better ways to go about it). Thank.

Answer 1

change your function like so:

$('#doaction2').click(function(e){
    action = $(this).prev('select').val();
    // or action = $('#bulk-action-selection2').val();
})

e is the event, not the reference to the element you clicked (and your button id is #doaction2)