1

I have 2 text fields. 

input type="text" placeholder="name" ng-model="name">
input type="text" placeholder="number" ng-model="number">

I validate that the button is not active if no data in text fields. I do not know how to make the button is disabled if there is no positive integer in the text field "number".

<button ng-disabled="!name || !number" value="buttonTest"></button>

I need to be a strictly input type = 'text'

  • You could just change the input type to number. Then in your ng-disabled have the expression number < 0 – Harbinger Feb 04 '16 at 22:02
  • @Harbinger no, I need to be a strictly input type = 'text' . thank you –  Feb 04 '16 at 22:19

2 Answers2

1

HTML:

<body ng-app="app">
  <div ng-controller="myController">
    <input type="text" placeholder="name" ng-model="name">
    <br/>
    <input type="text" placeholder="1234" ng-model="number">
    <br/>
    <button ng-model="button" ng-disabled="!name || !parseInt(number) || number < 0">Button</button>
  </div>
</body>

Script:

var app = angular.module('app', []);

app.controller('myController', ['$scope', function($scope) {
  $scope.parseInt = parseInt;
}]);

http://plnkr.co/edit/WBVMKWYSNBAxmQdg7i2K?p=preview

Harbinger
  • 594
  • 1
  • 8
  • 18
0

Write a function in your controller to check these values and return the result. I sometimes use the length property of strings to determine if there's a value. It covers null, undefined, and empty strings.

$scope.isPositiveInteger = function(value) {
    var floatValue = parseFloat(value);
    var isInteger = floatValue % 1 === 0;
    return isInteger && floatValue > 0;
}

HTML:

<button ng-disabled="name.length < 1 || !isPositiveInteger(number)" value="buttonTest"></button>
HankScorpio
  • 3,612
  • 15
  • 27
  • This is the right answer since you can't make the input type a number. The parseInt/Float will not work in an Angular expression on the html which is a shame. http://stackoverflow.com/questions/26293769/how-to-parseint-in-angular-js. You will have to write code in your controller like @HankScorpio illustrates here. – Harbinger Feb 04 '16 at 22:34