CODEWITHSUNDEEP
javascripthtml
Apzal Bahin
Apzal Bahin

Reputation: 61

Select dropdown in Java script without using selectedindex

I am trying to use below javascript to select the month value.I need to get the dropdown selection without using index.As the month values are taken from other file.Please help me. HTML:

<select name="param[start_month]">
<option label="Jan" value="1">Jan</option>
<option label="Feb" value="2">Feb</option>
<option label="Mar" value="3">Mar</option>
<option label="Apr" value="4">Apr</option>
<option label="May" value="5">May</option>
<option label="Jun" value="6">Jun</option>
<option label="Jul" value="7">Jul</option>
<option label="Aug" value="8">Aug</option>
<option label="Sep" value="9">Sep</option>
<option label="Oct" value="10">Oct</option>
<option label="Nov" value="11">Nov</option>
<option label="Dec" value="12" selected="selected">Dec</option>
</select>

Javascript:

document.getElementsByName("param[start_month]").value="Jan"

also i tried this too

document.getElementsByName("param[start_month]").label="Jan"

Upvotes: 2

Views: 159

Answers (1)

Pranav C Balan
Pranav C Balan

Reputation: 115222

Get the option bu using attribute equals selector and set selected property.

document.querySelector("[name='param[start_month]'] option[label='Jan']").selected = true;
<select name="param[start_month]">
  <option label="Jan" value="1">Jan</option>
  <option label="Feb" value="2">Feb</option>
  <option label="Mar" value="3">Mar</option>
  <option label="Apr" value="4">Apr</option>
  <option label="May" value="5">May</option>
  <option label="Jun" value="6">Jun</option>
  <option label="Jul" value="7">Jul</option>
  <option label="Aug" value="8">Aug</option>
  <option label="Sep" value="9">Sep</option>
  <option label="Oct" value="10">Oct</option>
  <option label="Nov" value="11">Nov</option>
  <option label="Dec" value="12" selected="selected">Dec</option>
</select>

Or set the value as the value of the attribute specified. Although getElementsByName returns collection of elements you need to get element by index.

document.getElementsByName("param[start_month]")[0].value = "1"
<select name="param[start_month]">
  <option label="Jan" value="1">Jan</option>
  <option label="Feb" value="2">Feb</option>
  <option label="Mar" value="3">Mar</option>
  <option label="Apr" value="4">Apr</option>
  <option label="May" value="5">May</option>
  <option label="Jun" value="6">Jun</option>
  <option label="Jul" value="7">Jul</option>
  <option label="Aug" value="8">Aug</option>
  <option label="Sep" value="9">Sep</option>
  <option label="Oct" value="10">Oct</option>
  <option label="Nov" value="11">Nov</option>
  <option label="Dec" value="12" selected="selected">Dec</option>
</select>

Upvotes: 2

Related Questions