CODEWITHSUNDEEP
javascriptjquery
SpringLearner
SpringLearner

Reputation: 13854

how to set dropdown menu a value

I have a table and each row has a checkbox and drop down menu.

This is one row

<tr>
   <td><input id="checked1" type="checkbox" class="cd" value="1"></td>
   <td><b>select</b></td>
   <td>
      <select name="questionType" id="questionType" class="qType QSelect">
         <option value="">--Select--</option>
         <option value="1">text</option>
         <option value="2">rate</option>
         <option value="3">etc</option>
         <option class="show-checkboxes" value="4">option</option>
      </select>
   </td>

   <td><input type="hidden" id="optionInputa1"></td>
</tr>

I want to set the dropdown to show text as selected by using jquery.

here are the 2 ways I tried

//$("#checked1").closest("input:select").val('text'); 
$('#checked1').parent().sibling().sibling().children().closest("input:select").val('text');

but none works.

Can anyone tell me what is wrong here?

you can see the fiddle

Upvotes: 0

Views: 90

Answers (3)

Bhushan Kawadkar
Bhushan Kawadkar

Reputation: 28523

Try this :

EDIT : As per discussion on chat, dropdown value get selected on page load and value equal to the checkbox value. Hence jQuery and JSfiddle link updated.

$(document).ready(function(){
    $('input[type=checkbox]').each(function(){
        $(this).closest('tr').find('select').val( $(this).val());
   });
});

Here is the JSFiddle

Upvotes: 1

Bhavik
Bhavik

Reputation: 4904

If you want it to be done on checkbox checked you may try this.. 

$("#checked1").click(function () {
    $("#checked1:checked").parents('tr').find('select').val('1');
});

Fiddle

Upvotes: 1

Eevee
Eevee

Reputation: 48594

What you're doing is super complicated and brittle!

closest only traverses upwards, and that selector will never match a select because a select is not an input.

Also you have to set a select's value based on the, er, value, not the display text.

And lastly your fiddle doesn't work because there's no table and the <tr>s never make it into the DOM.

You want to find the same select in that row, so just do that:

$('#checked1').closest('tr').find('select').val('1');

Updated fiddle: http://jsfiddle.net/E3q5x/3/

Upvotes: 1

Related Questions