angularcode-customer-manager-app-edit-customer.html

<style type="text/css">
  .form-horizontal input.ng-invalid.ng-dirty {
    border-color: #FA787E;
  }

  .form-horizontal input.ng-valid.ng-dirty {
    border-color: #78FA89;
  }
</style>
<div class="view">
    <div class="container">
        <div class="row">
        <nav class= "navbar navbar-default" role= "navigation" >
        <div class= "navbar-header" >
        <a class= "navbar-brand" href= "#/customers"><i class="glyphicon glyphicon-th-large"></i> Customers List </a>
        <a ng-show="customer._id" class= "navbar-brand" href= "#/edit-customer/0"><i class="glyphicon glyphicon-plus"></i> Create Customer </a>
        <a ng-show="customer._id" class= "navbar-brand pull-right"><i class="glyphicon glyphicon-edit"></i> Currently Editing Customer Number: {{customer._id}}</a>
        </div>
        </nav>
        <header>
            <h3>{{title}}</h3>
        </header>
        <div class="col-md-12">

<form role="form" name="myForm" class="form-horizontal">
<div class="row">
<div class= "form-group" ng-class="{error: myForm.name.$invalid}">
    <label class= "col-md-2"> Name </label>
    <div class="col-md-4">
    <input name="name" ng-model="customer.customerName" type= "text" class= "form-control" placeholder="Your name" required/>
    <span ng-show="myForm.name.$dirty && myForm.name.$invalid" class="help-inline">Name Required</span>
    </div>
</div>
<div class= "form-group">
    <label class= "col-md-2"> Email address </label>
    <div class="col-md-4">
    <input name="email" ng-model="customer.email" type= "email" class= "form-control" placeholder="Enter email" required/>
    <span ng-show="myForm.email.$dirty && myForm.email.$invalid && !myForm.email.$error.email" class="help-inline">Email Required</span>
    <span ng-show="myForm.email.$error.email" class="help-inline">Email is not valid</span>
    </div>
</div>
<div class= "form-group">
    <label class= "col-md-2">Address </label>
    <div class="col-md-4">
    <input ng-model="customer.address" type= "text" class= "form-control" placeholder= "Present Address"/>
    </div>
</div>
<div class= "form-group">
    <label class= "col-md-2">City </label>
    <div class="col-md-4">
    <input ng-model="customer.city" type= "text" class= "form-control" placeholder= "Current City"/>
    </div>
</div>
<div class= "form-group">
    <label class= "col-md-2">Country </label>
    <div class="col-md-4">
    <input ng-model="customer.country" type= "text" class= "form-control" placeholder= "Residing Country"/>
    </div>
</div>
<div class= "form-group">
    <label class= "col-md-2"></label>
    <div class="col-md-4">
    <a href="#/" class="btn">Cancel</a>
        <button ng-click="saveCustomer(customer);" 
                ng-disabled="isClean() || myForm.$invalid"
                class="btn btn-primary">{{buttonText}}</button>
        <button ng-click="deleteCustomer(customer)"
                ng-show="customer._id" class="btn btn-warning">Delete</button>
    </div>
</div>
</div>
</form>
        </div></div>
    </div>
</div>