CODEWITHSUNDEEP
javascriptangularjs
Oblomingo
Oblomingo

Reputation: 698

How to update angularjs model (with ng-model-options parameter) on button press?

I have some inputs (text, checkboxes, selects).

I want to update controller model only after button press.

<input type="email" ng-model="vm.email" ng-model-options="{updateOn:'not blur, maybe custom event'} }"/>
<button ng-click="vm.apply()">Apply</button>

vm.apply = function() {
    //How to fire event to trigger model update?
}

Upvotes: 1

Views: 1354

Answers (1)

Oblomingo
Oblomingo

Reputation: 698

Ok, i guess i find solution. We can use a submit event. So only when user will press submit button, model will update values.

<!doctype html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>Example - example-example79-production</title>
  <script src="//ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
</head>
<body ng-app="submitExample">
  <script>
  angular.module('submitExample', [])
    .controller('ExampleController', ['$scope', function($scope) {
      $scope.list = [];
      $scope.text = 'hello';
      $scope.submit = function() {
        if ($scope.text) {
          $scope.list.push(this.text);
        }
      };
    }]);
</script>
<form ng-submit="submit()" ng-controller="ExampleController">
  Enter text and hit enter:
  <input type="text" ng-model="text" ng-model-options="{ updateOn: 'submit' }" name="text" />
  <input type="submit" id="submit" value="Submit" />
  <pre>list={{list}}</pre>
  <pre>text={{text}}</pre>
</form>
</body>
</html>

Upvotes: 2

Related Questions