Teknotica
Teknotica

Reputation: 1136

Input text not being cleared out

I'm trying to clear an input text after saving some data but it just doesn't work. This is what I've tried so far (what it's in comments too):

Thanks in advance for any help!

HTML:

<div id="add-tag">
    <h3>Add new tag</h3>
    <form name="addTagForm">
        <input class="form-control" type="text" ng-model="newTag" ng-change="onChangeTag()">
        <button class="btn btn-primary" ng-click="addTag(newTag)">Add Tag</button>  
    </form>             
</div>  

JS:

//$scope.master = {};

// Reset scope
$scope.reset = function() {
    $scope.newTag = "";
    //$scope.newTag = angular.copy($scope.master);
};


$scope.addTag = function(tag) {

    // Save some data (this works fine) 
    // ....

    // Reset input field
    $scope.reset();     
};

UPDATE:

My ng-controller was set to the parent template (I'm using ui.router). Just added it to the child template and it indeed worked.

<div id="add-tag" ng-controller="FormController">
    <h3>Add new tag</h3>
    <form name="addTagForm">
        <input class="form-control" type="text" ng-model="newTag" ng-change="onChangeTag()">
        <button class="btn btn-primary" ng-click="addTag(newTag)">Add Tag</button>  
    </form>             
</div>  

Upvotes: 0

Views: 982

Answers (1)

Bik
Bik

Reputation: 553

I am new in angularjs but after trying some thing i got some sort of solution for you. You can check this bin. I have just added a controller :-

function test_c($scope){

$scope.reset = function() {
$scope.newTag = "";
//$scope.newTag = angular.copy($scope.master);
};

$scope.addTag = function(tag) {

// Save some data (this works fine) 
// ....

// Reset input field
$scope.reset();     
};}

Look at the html part:-

<body ng-app>
  <div id="add-tag" ng-controller="test_c">
    <h3>Add new tag</h3>
    <form name="addTagForm">
    <input class="form-control" type="text" ng-model="newTag" ng-change="onChangeTag()">
    <button class="btn btn-primary" ng-click="addTag(newTag)">Add Tag</button>  
    </form>             
</div>  

Upvotes: 1

Related Questions