I am building a Ionic app. I have 4 Select boxes in the form and have assigned tabindexes to them in sequence. The data is populated dynamically for all Select’s based on ng-change.
Code is like below.
<div class="col">
<div class="row">
<div tabindex="1">
Pickup Date
<select id="pdSelect" ng-options="pdate in pickupDates" ng-change="dofirst()">
</select>
</div>
<div tabindex="2">
Pickup Time
<select id="ptSelect" ng-options="ptime in pickupTimes" ng-change="dosecond()">
</select>
</div>
</div>
<div class="row">
<div tabindex="3">
Dropoff Date
<select id="ddSelect" ng-options="ddate in DeliveryDates" ng-change="dothird()">
</select>
</div>
<div tabindex="4">
Dropoff Time
<select id="dtSelect" ng-options="dtime in DeliveryTimes" ng-change="dofourth()">
</select>
</div>
</div>
</div>
When I run it in ios emulator or device, the NEXT ( ‘>’ ) button is disabled when we click Pickup Time. Normally it should be enabled and go to Dropoff Date.
Also, the NEXT ( ‘>’ ) button is disabled when we click Dropoff Date.
Any suggestions on how to enable NEXT ( ‘>’ ) button please.
Below are the images.
