This may be a very typical task yet i am having issued cracking a solution for it. 

I am using a form which has 2 select options in it

```
<form enctype="multipart/form-data" id="uploadimage"  method="post" action="" class="allForms">

<select id="parentCatSel" onchange=listsubcategory(this.value)>
<option value="">Choose category</option>
</select>

<div id="subcatcontainer"><select id="subCatSel"><option value="">Choose Sub category</option></select></div>

<input name="save" class="save" type="submit"  id="save" value="Save"/>
</form>

```

Based on the category chosen in "parentCatSel" the "subcatcontainer" is populated with a select option of subcategories
for the chosen parent category
listsubcategory()

returns

```
 <select id="subCatSel"><option value="">Choose Sub category</option>
<option value="1">1</option>
<option value="2">2</option></select>

```

the display of subcategory works fine with no errors, however when i try to post the values in the form , i am not able to retrieve the value of chosen option in "subCatSel" as below

```
    document.getelement['subCatSel']= null
post['subCatSel'] = null

```

please suggest an alternative.
['https://Stackoverflow.com/questions/36096018', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/1332909/']
Add name attribute to your select inputs. 

```
<select id="subCatSel" name="subCatSel"><option value="">Choose Sub category</option>

```
Sorry guys, my terrible bad of coding in the actual code. I missed out on a quote in the select

 just changed that to 

it works as wanted!!, thanks everyone