I have a select element and would like to allow the user to click an add button add additional select elements so that the user can continue to select additional items.
When I use the code below, the dropdown does not display and no additional select elements are added when I click the "Add" button.
Any suggestions on how to do this correctly?
Clarification: I want to add new dropdowns that always include the same items. So I want to add new select elements, not new items within a select element.
HTML:
<select ng-repeat="class in project.classes" class="form-control" id="class" name="class"
ng-model="editProject.project.class" ng-options="classid.class group by classid.code for classid in editProject.classids track by classid.class">
<option value="">--Select Class--</option>
</select>
<button ng-click="editProject.project.class.push({})">Add</button>
Controller:
var editProject = this;
editProject.project.class = [];
editProject.classids = [
{code: '1', class: 'Chemicals'},
{code: '2', class: 'Paints'},
// . . .
];