0

I'm working with Bootstrap 3.3.6 and wanted to use a selector to choose a certain quantity. Problem is that I want the options to go all the way to 99, but I noticed the code is too repetitive making the entire code a bit too much ..

Right now I've got:

<div class="form-group">
   <label for="sel1">select quantity: </label>
   <select class="form-control" id="sel1">
       <option>1</option>
       <option>2</option>
       <option>3</option>
       <option>4</option>
       <option>5</option>
   </select>
</div>

Do I have to write <option></option> 99 times or is there perhaps an easier and faster way to do this? Perhaps with angularJS? if so, any ideas how?

Thanks!

Tom Kustermans
  • 521
  • 2
  • 8
  • 31
  • 1
    Possible duplicate of [AngularJS ng-options create range](http://stackoverflow.com/questions/11160513/angularjs-ng-options-create-range) – baao Aug 18 '16 at 13:42
  • Sorry, had no idea since I wasn't sure Angular was an option. – Tom Kustermans Aug 18 '16 at 13:43
  • No problem. Just mark the question as a duplicate, then both questions can be found together – baao Aug 18 '16 at 13:44

3 Answers3

1

You can use <input type="range"/> too:

<input type="number" name="quantity" min="1" max="99" value="22">

In view of the semantic I think this element is better instead of 99 <option> items.

Sebastian Brosch
  • 42,106
  • 15
  • 72
  • 87
0

If you have acces to PHP you could do:

<div class="form-group">
   <label for="sel1">select quantity: </label>
   <select class="form-control" id="sel1">
     <?php for($i=1; $i <= 99; $i++){ ?>
       <option><?php echo $i; ?></option>
     <?php } ?>
   </select>
</div>
Cagy79
  • 1,610
  • 1
  • 19
  • 25
0

you can use a loop:

var text = 0;
for (i = 0; i <100; i++) { 
    text += "<option>"+[i]+"</option><br />";
}
fernando
  • 814
  • 1
  • 9
  • 24