AngularJS validation input different than zero

Question

starting that I'm realy new in progrraming especialy Angular. I want to validate input not to allow number 0 . Here is my code:

<form ng-app="linearEquation" ng-controller="calcCtrl" 
              name="calculator" ng-init="notValid=true" novalidate>
        <div>
            <h3 class="field">Kalkulator oblicza wartość równania 
                <var>ax = b</var>.</h3>
            <div class="field">
                <p>
                    Podaj wartość a:<br/>
                    <input type="number" name="fieldA" ng-model="a" required integer />
                    <span class="error" ng-show="calculator.fieldA.$invalid"/>
                    <span  ng-show="calculator.fieldA.$error.number">
                    Proszę podać liczbę</span><br/>
                </p>
                <p>
                    Podaj wartość b:<br/>
                    <input type="number" name="fieldB" ng-model="b" required integer />
                    <span class="error" ng-show="calculator.fieldB.$invalid"/>
                    <span  ng-show="calculator.fieldB.$error.number">
                    Proszę podać liczbę</span>
                </p>
                <p>
                    <button type="submit"   
                                ng-disabled="
                                    calculator.fieldA.$dirty &&
                                    calculator.fieldA.$invalid ||
                                    calculator.fieldB.$dirty &&  
                                    calculator.fieldB.$invalid" 
                                 ng-click="count()">
                        Oblicz
                    </button>
                </p>
            </div>
            <p class="field" id="result">x = {{c.toFixed(2)}}</p>
        </div>

How should I validate it. Also the button doesn't seem to be disabled on load of the page. How to manage this?

It's not disabled because it can only be disabled if at least one field is dirty and invalid. The condition should be ng-disabled="calculator.$invalid". — JB Nizet
– JB Nizet, Commented Jun 2, 2015 at 18:34

Kosta · Accepted Answer · 2015-06-02 18:52:13Z

1

You should remove the both $dirty if you want the button to disabled on start. And you better use ng-pattern directive to validate numbers 1-9 and omit "0". Your input should look like something like that:

<input type="number" name="fieldA" ng-model="a" required ng-pattern="/[1-9]/" />

answered Jun 2, 2015 at 18:52

Kosta

4634 silver badges7 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Vicky Kumar · Accepted Answer · 2016-06-16 12:19:04Z

0

I understan two case here first that in field 0 should not be allowed at all for example 0 is invalid and 10 is also invalid 550 is also invalid In that case use

<input type="number" name="fieldA" ng-model="a" required ng-pattern="/[1-9]*/" />

second case zero zero could be part of number but value 0 should not be allowed for example 0 is invalid but 01 is valid, 501, is valid and 0000 is invalid in that case

<input type="number" name="fieldA" ng-model="a" required ng-pattern="/([1-9][0-9]*||[0]*[1-9]+[0-9]*)/" />

according to regular expression if it starts with 1-9 it can have any number after that, if it starts with 0 it should have atleast one non zero value followed by it

answered Jun 16, 2016 at 12:19

Vicky Kumar

1,4441 gold badge15 silver badges31 bronze badges

Collectives™ on Stack Overflow

AngularJS validation input different than zero

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related