Utilizing the bootstrap combobox with search functionality has been successful when using static options, as shown below:
<form role="form">
<div class="form-group">
<label>Select options</label>
<select class="combobox input-large form-control" style="display: none;">
<option value="" selected="selected">Type Planet name...</option>
<option value="0">Mercury</option>
<option value="1">Earth</option>
<option value="2">Venus</option>
<option value="3">Mars</option>
<option value="4">Jupiter</option>
</select>
</div>
</form>
My goal is to dynamically load options from an array. I attempted using ng-options and ng-repeat but encountered issues with displaying values in the combo box. Preferably, I would like to use JavaScript.
Attempted Code:
<select class="combobox input-large form-control" style="display: none;"
ng-model="PlanetData.selectedPlanet">
option value="" selected="selected">Type for Planet...</option>
<option ng-repeat="planet in PlanetData.availablePlanets" value=" {{planet.id}}">{{planet.planetName}}</option>
This code creates a combobox with the text "Type for channel", however the planet data does not appear within the combobox options, instead it appears below it. Seeking guidance on how to properly bind the data so that it displays within the combobox.