Question

Is there a way to insert values in a drop down menu with a simple form? I have this drop down menu

<form>
  <select name="users" onchange="showUser(this.value)">
    <option value="">Select a category:</option>
    <option value="movie">Movie</option>
    <option value="musik">Musik</option>
    <option value="books">Books</option>
    <option value="images">Images</option>
  </select>
</form>

Should I use an array? I been searching the net but couldn’t find anything that would help.

Answer 1

Here is a JavaScript solution to add items to a drop down.

The HTML to use..

 <form>
    <select id="categories" name="users" onchange="showUser(this.value)">
    <option value="">Select a category:</option>
    <option value="movie">Movie</option>
    <option value="musik">Musik</option>
    <option value="books">Books</option>
    <option value="images">Images</option>
    </select>
    </form>​​

JavaScript code…

var categories = document.getElementById("categories");

var newOption = document.createElement('option');
newOption.innerText = "New value";
newOption.setAttribute('value', 'newvalue');

categories.appendChild(newOption);
​

jQuery code… (a lot shorter)

$("#categories").append("<option value='newvalue'>New Value</option>");

Here is the JavaScript JSFiddle and the jQuery JSFiddle to play with!