Hi, I’m trying to create a form with two div (or ion-content) aligned vertically one above the other, the first containing two fields and a button for the filter, and the second with a list dynamically generated by the search for the first .
The problem is that I would like to disable the scroll of the first but not the second.
Using
<ion-content padding =" true "class =" has-header-content ionic scroll-scroll "scroll =" false ">
for the first, I was able to disable the scroll, but for the second there towards :(.
I tried to use
<ion-scroll>
but not knowing the height of the list, the resulting div is very small…
In short, I can not create the second “block” scrollable.
Can someone please give me a hand?
This is the full html code:
<script id="listaPage.html" type="text/ng-template">
<ion-view title="Valves">
<ion-content style="background: green;" padding="true" class="has-header" scroll="false">
<form ng-controller="listaController" ng-submit="btnCerca()">
<div style="background: blue;" padding="true" class="scroll-content ionic-scroll" scroll="false">
<ion-toggle toggle-class="toggle-positive" ng-model="lista.oCode">Original Code</ion-toggle>
<label class="item item-input" name="cercaLista">
<i class="icon ion-search placeholder-icon"></i>
<input type="search" placeholder="Search" ng-model="lista.cerca">
</label>
<input class="button button-block button-positive" type="submit" value="Find">
{{lista.totale}}
</div>
<div style="background: red;" padding="true" class="scroll-content ionic-scroll" scroll="true">
<ion-scroll>
<ion-list>
<ion-item ng-repeat="val in lista.listaValves">
<b>Desc:</b> {{val.artdes}} <br>
<b>Disp:</b> {{val.disp}}
</ion-item>
</ion-list>
</ion-scroll>
</div>
</form>
</ion-content>
Thank you very much