Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is there any way to check the whole page is dirty or not?

i am new at angularJS, i want to check my page is dirty or not. i know how to check dirty form but not whole page(like i am using directive in this form).is there any way to check directive part is dirty or not? like in my page i have directive for star rating. in that if i change rating then i want to check the page is dirty or not?

<form name="reviewForm">     
        <div class="row">
            <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
                <div>
                    <table class="rwd-table table-responsive table-bordered table-striped" >
                        <tbody>
                            <tr data-ng-repeat="review in reviewModifyData.review.KeyAreaList" >
                                <td  class="mywidth">
                                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12"> 
                                        <strong class="reviewPadding">
                                            <span  data-ng-bind="review.Title"></span>
                                        </strong>
                                        <br>
                                    </div>
                                    <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12">
                                        <small class="reviewPadding"><span data-ng-bind="review.HelpText | limitTo:150"></span><span tooltip-placement="auto" uib-tooltip="{{review.HelpText}}"  data-ng-show="review.HelpText.length > 150">...</span></small>
                                    </div>
                                </td>                                                       
                                <td >  
                                        <span class="visible-sm visible-xs"> &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</span>
                                        <angular-star-rating min="reviewModifyData.minValue" max="reviewModifyData.review.RatingLevel"
                                                             value='review.Rate' hover='reviewModifyData.changeOnHover'
                                                             is-readonly='reviewModifyData.isReadonly'>                                 
                                        </angular-star-rating>
                                    &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

                                </td>
                            </tr>
                        </tbody>
                    </table>
                    <br>

                    <div class="row"  data-ng-if="reviewModifyData.section.length !== 0" data-ng-class="{'has-error': reviewForm.$submitted && reviewForm.Remark.$invalid,'has-feedback': reviewForm.$submitted && reviewForm.Remark.$valid}">
                        <div class="form-group col-lg-12 col-md-12 col-sm-12 col-xs-12">
                            <label class="control-label" > Remark</label> <span data-ng-if="reviewModifyData.review.IsRemarkMandetory" class="errortext">*</span>
                            <div class="has-feedback">
                                <textarea class="form-control noresize"  data-ng-if="!reviewModifyData.review.IsRemarkMandetory" rows="3"  name="Remark" placeholder="Enter Remark"  data-ng-model='reviewModifyData.review.Remark' ></textarea>
                                <textarea class="form-control noresize" required data-ng-if="reviewModifyData.review.IsRemarkMandetory" rows="3"  name="Remark" placeholder="Enter Remark"  data-ng-model='reviewModifyData.review.Remark' ></textarea>
                            </div>
                            <span class="text-danger" data-ng-show="reviewForm.$submitted && reviewForm.Remark.$error.required">Please Enter Remark <i class="fa fa-exclamation-circle"></i></span>
                        </div>
                    </div>    
                </div>
            </div>
        </div>
</form>

now i have tried in my js like this.

if ($scope.reviewForm.$dirty) {
                toastr.error('The form is dirty, do you want to stay on the page?');
                return;
            }

Thanks in advance,

like image 269
Aman Gojariya Avatar asked Jun 28 '17 12:06

Aman Gojariya


People also ask

How do you know if a form is dirty or not?

if you want to see if the form is dirty you should check the viewModel in kendo way sample. basically I've created a viewModel which is impements the ObservableObject interface and has a two way binding with the form's container.

What is dirty check in Javascript?

Dirty Means If user change any data or check any box or select any value from drop down and he forget to save the data and click on exit button or closing the browser then if you want to show the message to user, before cancel or exit please save the data. Here is the code.

What is dirty field HTML?

Dirty is a term used to flag if data or state has changed. Many frameworks that do form input/edit have a . dirty property you can check to see if you should bother saving changes or send an alert to the user to see if they want to save changes. 1 Like. justin March 8, 2021, 2:08pm #4.

How do you check that an HTML form has been changed?

multiple) c = (def != skills. selectedIndex); if (c) alert("#skills has changed"); That's how you check whether any form element has changed.


1 Answers

you can access formController in your directive (look at this answer) than use $setDirty() method

like image 170
ada Avatar answered Sep 29 '22 11:09

ada