Mannu
Mannu

Reputation: 71

Input field not updating with ng-keydown event

In this piece of code I want to add validation to input field, if the value is 0 but I don't know why I am not able to update and enter new value in the input field. Simply I am not able to change the input field value.

Value remain same if I delete existing value and add something in existing value.

Here is HTML code:

<input ng-model="lineitemDetailsCtrlAs.lineItems.orderedQuantity" type="text" class="col-md-6 text-right panel-row-spacing"
                ng-keydown="valueChanged($event)" required
                />

and angular code is:

$scope.valueChanged = function (event) {
 var quantityRequire={};
    if (event.keyCode === 48 || lineitemDetailsCtrlAs.lineItems.orderedQuantity == 0) {
            quantityRequire = {
              "messageId": "ORDERED_QUANTITY",
              "params": [],
              "severity": "ERROR"
            };
            lineitemDetailsCtrlAs.errorMessages.push(quantityRequire);
          }
          else{
            event.preventDefault();
          }
    };

Upvotes: 0

Views: 396

Answers (2)

Zhiliang Xing
Zhiliang Xing

Reputation: 1057

I think Rameshkumar Arumugam is right about what's wrong with your code, below is a working example

angular.module("myApp", [])
  .controller("MainCtrl", function($scope) {
    $scope.lineItems = {
      orderedQuantity: 12
    };
    $scope.errorMessages = [];
    $scope.valueChanged = function(event) {
      var quantityRequire = {};
      if (event.keyCode === 48 || $scope.lineItems.orderedQuantity == 0) {
        quantityRequire = {
          "messageId": "ORDERED_QUANTITY",
          "params": [],
          "severity": "ERROR"
        };
        alert(quantityRequire["messageId"]);
        $scope.errorMessages.push(quantityRequire);
      }
    };
  })
<div ng-app="myApp">
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
  <div ng-controller="MainCtrl">
    <input ng-model="lineitemDetailsCtrlAs.lineItems.orderedQuantity" type="text" class="col-md-6 text-right panel-row-spacing" ng-keydown="valueChanged($event)" required />
  </div>
</div>

Upvotes: 0

Rameshkumar Arumugam
Rameshkumar Arumugam

Reputation: 151

you are stopping event by "event.preventDefault();", because only keycode 48 (only number 0) is acceptable others keyevents are falling down on else condition and stop updating input value.

Upvotes: 1

Related Questions