Form Validation angular/bootstrap

Question

Here's FIDDLE

Not able to understand that why the required validation is not working ??

HTML

<div ng-app="app">
    <div ng-controller="myctrl">
        <form name="myform" class="form form-horizontal" novalidate>
            <fieldset class="fieldset" ng-show="payment == 'bankAccount'" class="form-group clearfix">
                <ul class="form-group">
                    <li ng-class="{
                'has-error':  myform.routingNumber.$invalid,
                'has-success':myform.routingNumber.$valid}">
                        <label for="routingNumber">Bank Routing Number</label>
                        <div class="" ng-show="myform.routingNumber.$error.required"> <span class="help-block">Please enter routing number</span>

                        </div>
                        <input type="text" name="routingNumber" class="form-control" required/>
                    </li>
                </ul>
            </fieldset>
        </form>
    </div>
</div>

JS

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

Answer 1

You need to provide an ng-model for the angular validation on the form to kick in.

Try:-

<input type="text" ng-model="routingNumber" name="routingNumber" class="form-control" required/>

On a side note:- there is no use of using label for without using id on the target input.

Demo