Modal with scrollable area issues


#1

Hi,
I am trying to implement a modal with one static area which has a caption and resizable text box and a scrollable list of items underneath as a part of the same modal window. The template code is very simple, but the “scrollable list view” area is not resizing properly.
What could be the issue ? I have to make ion-content as a scrollable list view (or probably have a slide-box area ?) and keep a header and text info. I believe it should not be a sub-header on the modal, but than how exactly should i implement this modal window with ionic ?

Thank you !
Dmitry


Rejecting

<header class="bar bar-subheader bar-stable">
    <div class="item">
        <div class="row">                                                 
            <div class="col col-10">                 
                <p class="task-timesheet"></p>
            </div>                                                  
            <div class="col col-90" >                                                         
                <h3 style="white-space: normal;">Please provide reject reason for the following items</h3>
            </div>                                                                                      
        </div>  

        <div class="padding">
            <label class="item item-input">
                <textarea id="Textarea1" ng-model="model.rejectReason" rows="4" placeholder="Please provide reject reason" required></textarea>            
            </label>
        </div>                            
    </div>
</header>

<ion-content has-header="true" has-subheader="true"  has-footer="true" scroll="true" >
    <ion-list>
        <ion-item ng-repeat="task in taskRejectTimesheet.taskList()">            
            {{ task.SummaryLine1 }}                         
        </ion-item>                                                                           
     </ion-list>
</ion-content>    
        
<ion-footer-bar id="footer" type="bar-stable" align-title="center">        
    <div class="button-bar">
        <button class="button button-clear" ng-click="rejectClose()">Cancel</button>
        <button class="button button-clear" ng-click="rejectTask(model.rejectReason)" ng-disabled="!(model.rejectReason && model.rejectReason.length>0)">Ok</button>
    </div>
</ion-footer-bar>
___________________________

#2

If the textarea is resizing, the scroll area needs to be notified of the change in content.

$scope.$broadcast('scroll.resize');