How to reset the angular scope variable when the Html tag gets executed?

Question

Hy, I have a variable bound to my scope,


$scope.isSuccess = {
       invalidPhone : false
}

And I am using a span to display a message when the variable gets true ...

<form name = "myForm">
    <span ng-if="isSuccess.invalidPhone && myForm.$submitted">
          Please enter valid phone no.
    </span>
</form>

Now I am calling a Js method when the form gets submitted..which validates the phone number and set

$scope.isSuccess.invalidPhone = true

Only if it is incorrect.

Now I want to reset the value of this variable to false when my span gets executed. How to do it ? Thank you

What do you mean when you say "span gets executed"? What is executing the span? — georgeawg
– georgeawg, Commented Feb 1, 2021 at 14:38
@georgeawg actualy I am validating the phone number when the form gets submitted , so need to reset the variable every time after I've checked whether its value is true or not, and I am checking in my span tag using ng-if when I am displaying error message , So how to just change my variable value after this particular span. Thanks — Ishmeet Singh
– Ishmeet Singh, Commented Feb 1, 2021 at 14:45
AngularJS is using two way data binding mechanism. You just need to reset the '$scope.isSuccess.invalidPhone' value then the span automatically will show or hide the content. You can reset the variable on successful validation of the data. — Ganesh C
– Ganesh C, Commented Feb 1, 2021 at 14:57
Yes I am changing its value if phone number is not correct using the method that called when form submitted but actually now after its value changed and I’ve checked now I need to reset its value , I can create a method in Js but how can I call within or just after my span , whether my msg displayed or not.. @Ganesh help Is there any angular directive that can be used to call my method... if I call two methods at same time when form submitted since there is only one button , then it will not work — Ishmeet Singh
– Ishmeet Singh, Commented Feb 1, 2021 at 16:29

georgeawg · Accepted Answer · 2021-02-01 23:56:07Z

1

Use the ng-change directive to update status of the flag:

<form name = "myForm">
    <input name="phoneNumber" ng-model="data.num" type="text" 
           ng-change="updateStatus(data.num)" /> 
    <span ng-if="isSuccess.invalidPhone && myForm.$submitted">
          Please enter valid phone no.
    </span>
</form>

Every time the user changes the phone number, the function will be called:

$scope.updateStatus = function(num) {
    //Check phone number here
});

For more information, see

edited Feb 1, 2021 at 23:56

answered Feb 1, 2021 at 18:42

georgeawg

49k13 gold badges78 silver badges98 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to reset the angular scope variable when the Html tag gets executed?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related