Hi,
I have Ionic v1 app using Ionic version 1.7.16 (I know I am way behind. Will be upgrading later this year). When I select the option from the third select element, the bottom half of the screen is hidden. Once I tap on Search bar at the bottom and close the keyboard, then I can see the bottom half of the app. Below is the screenshot of the issue.
I am using <select><option>
, not <ion-select>
Sample code:
<ion-view>
<ion-nav-title>{{ appTitle }}</ion-nav-title>
<ion-content class="has-footer">
<page-title title="Cars"></page-title>
<ion-list>
<ion-item ng-if="modelNotSelected">
<div>
<div class="row row-center " ng-if="((!selectedCarMake || !selectedModel || !selectedYear)" >
<strong>Select</strong>
</div>
<div class="row">
<div class="col col-33">
<select ng-model="selectedCarMake" ng-options="make for make in allCarMakes"
data-ng-change="setSelectedCarMake(selectedCarMake)">
<option value="" disabled>Make</option>
</select>
</div>
<div class="col col-33">
<select ng-model="selectedModel" ng-options="model for model in models"
data-ng-change="setSelectedModel(selectedModel)"
ng-disabled="!selectedCarMake">
<option value="" disabled>Model</option>
</select>
</div>
<div class="col col-34">
<select ng-model="selectedYear" ng-options="year for year in years"
data-ng-change="setSelectedYear(selectedYear)"
ng-disabled="(!selectedCarMake || !selectedModel)">
<option value="" disabled>Year</option>
</select>
</div>
</div>
</div>
</ion-item>
<div class="marg-pad-zero" ng-show="selectedYear">
<ion-item class="item-divider">
Total Sales - Current Year
</ion-item>
</div>
</ion-list>
</ion-content>
<ion-footer-bar keyboard-attach class="bar-balanced item-input-inset">
</ion-footer-bar>
</ion-view>
Appreciate any help. Thank you!