ng-submit give old value after form submit

Question

i'm new in angularjs, ng-submit give old value after form submit

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
  $scope.myTxt = "You have not yet clicked submit";
  $scope.sidebarname = "Vendor";
  $scope.myFunc = function () {
      $scope.myTxt = "You clicked submit!";
      alert($scope.sidebarname);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">

<form ng-submit="myFunc()">
  <input ng-value="sidebarname" type="text">
  <input  type="submit">
</form>

<p>{{myTxt}}</p>



</div>

after form submit $scope.sidebarname give old value Vendor , i have read and search about it but nothing helpful.

any help or suggestion will be helpful

`ng-value` will do one way binding... the change in `sidebarname` will not reflect in its model. for the same use `ng-model` — Pankaj Parkar, May 04 '18 at 06:24

score 2 · Answer 1 · answered May 04 '18 at 06:10

2

Try:

<form ng-submit="myFunc()">
  <input ng-model="sidebarname" type="text">
  <input  type="submit">
</form>

Note: ng-model is different from ng-value

answered May 04 '18 at 06:10

Shashank Vivek

16,888
8
62
104

score 1 · Answer 2 · answered May 04 '18 at 06:13

var app = angular.module("myApp", []);
app.controller("myCtrl", function($scope) {
  $scope.myTxt = "You have not yet clicked submit";
  $scope.sidebarname = "Vendor";
  $scope.myFunc = function () {
      $scope.myTxt = "You clicked submit!";
      alert($scope.sidebarname);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.6.9/angular.min.js"></script>
<div ng-app="myApp" ng-controller="myCtrl">

<form ng-submit="myFunc()">
  <input ng-model="sidebarname" type="text">
  <input  type="submit">
</form>

<p>{{myTxt}}</p>



</div>

score 0 · Answer 3 · answered May 04 '18 at 06:47

To bind the value from HTML page and controller we should use ng-model. In your case, it is always taking the value from the controller and not getting binded by the value from your HTML page.

ng-value is different from ng-model

<form ng-submit="myFunc()">
     <input ng-model="sidebarname" type="text">
     <input  type="submit">
</form>

<p>{{myTxt}}</p>

ng-submit give old value after form submit

3 Answers3