Dialog issues



  • I am opening a dialog but when i open it for the first time it shows angular coding part in it ,then shows properly. Plesae suggest me the solution for this.

    Code is this.

    <ons-dialog var="feedback" animation="none" mask-color="rgba(0, 0, 0, 0.4)" cancelable>
    
        <div class="dialog" style="z-index: 20001;min-width: 98%!important;">
    
            <ons-icon size="40px" icon="ion-ios-close-empty" class="crossicon" ng-click="hidefeedbackDialog()"></ons-icon>
    
            <div ng-show="showStars">
    
    
                <ons-row>
    
                    <ons-col ng-repeat="rating in ratings">
    
                        <div star-rating rating-value="rating.current" max="rating.max" on-rating-selected="getSelectedRating(rating)">
                        </div>
                    </ons-col>
                </ons-row>
            </div>
    
            <div class="main_feedback">
    
                <div ng-show="showMe">
                    <ons-toolbar class="toolbar_clr">
                        <div class="right">
                            <ons-icon size="40px" icon="ion-ios-close-empty" style="color:white" class="crossicon" ng-click="hidefeedbackDialog()"></ons-icon>
    
                        </div>
                        <div class="center">
                            <span style="color:white">{{currentLocale.feedback}}</span>
                        </div>
                    </ons-toolbar>
    
                    <ons-row>
                        <ons-col ng-repeat="rating in ratings">
    
                            <div star-rating rating-value="rating.current" max="rating.max" style="margin: 38px 0 0 0;" on-rating-selected="getSelectedRating(rating)">
                            </div>
                        </ons-col>
                    </ons-row>
                    <div id="rcorners1">
    
                        <div>
                            <ul class="feedMessage" ng-repeat="x in myData | orderBy:'CreateDate'">
                                <li class="messagebox" ng-show="x.IsAdmin==false">
                                    <p class="msgg">  {{ x.Message}} </p>
                                    <p class="date"> {{x.DateDisplayed }}</p>
    
                                <li class="messagebox1" ng-show="x.IsAdmin==true">
                                    <p class="msgg">  {{ x.Message}} </p>
                                    <p class="date"> {{x.DateDisplayed }}</p>
    
                            </ul>
    
                        </div>
    
                    </div>
    
                    <div class="msg ">
                        {{currentLocale.feedMessage}}!.
    
                    </div>
    
                    <ul class="asFedback">
                        <li style="padding-top:0px;">
                            <textarea placeholder="Add Your Feedback" ng-model="feedback.text"></textarea>
                            <img src="images/send.png" class="sendimage" ng-click="send_feedback(feedback)">
                        </li>
                    </ul>
    
    
                    <ons-dialog var="dialogplay" animation="none" mask-color="rgba(0, 0, 0, 0.4)">
                        
                            <div style="text-align: center; padding: 5px;">
                                <p style="color:#125073;margin:3px">
                                    Redirecting to Play Store.
                                <p align="center" style="margin:3px"> <ons-icon icon="ion-load-c" size="25px" spin="true" style="margin-top:5px"></ons-icon></p>
    
                                <button type="button" class="fedokButton" ng-click="click('Rate Us');closeDialog()">{{currentLocale.ok}}</button>
    
                                <button type="button" class="fedcancelButton" ng-click="stopTimer()">{{currentLocale.no}}</button>
                            </div>
                            
              </ons-dialog>
    
                </div>
            </div>
        </div>
    </ons-dialog>
    

    And to open it
    code is this

     $scope.showFeedback = function () {
            var feedbackDlg = "Feedback.html"
            if (!$scope.dialogs[feedbackDlg]) {
                ons.createDialog(feedbackDlg, { parentScope: $scope }).then(function (dialog) {
                    $scope.dialogs[feedbackDlg] = dialog;
                    dialog.show();
                });
            }
            else {
                $scope.dialogs[feedbackDlg].show();
            }
            $scope.notify();
        }
    

  • Onsen UI

    @Shubham-Kaushik Didn’t see any obvious mistake. Can you provide a minimum app where this is reproducible? Ideally made with tutorial.onsen.io , but a Github repo would also work.


Log in to reply