diff --git a/brewman/static/base.html b/brewman/static/base.html
index 901d31a8..c4e7f3cc 100644
--- a/brewman/static/base.html
+++ b/brewman/static/base.html
@@ -9,8 +9,6 @@
     <meta name="author" content="Tanshu">
 
     <!-- Le styles -->
-    <!-- <link rel="stylesheet" type="text/css" media="screen" href="/css/style.css"/> -->
-
     <link rel="stylesheet" type="text/css" media="screen" href="/css/bootstrap.min.css"/>
     <!-- <link rel="stylesheet" type="text/css" media="screen" href="/css/bootstrap-theme.min.css"/> -->
 
diff --git a/brewman/static/css/style.css b/brewman/static/css/style.css
deleted file mode 100644
index dfb25f2e..00000000
--- a/brewman/static/css/style.css
+++ /dev/null
@@ -1,174 +0,0 @@
-/*!
- * My Custom Stylesheet for
- * Bootstrap v2.0.3
- *
- */
-
-.thumbnails.small {
-    margin-left: -50px;
-}
-
-.thumbnails.small > li {
-    float: left;
-    margin-bottom: 3px;
-    margin-left: 5px;
-}
-
-.thumbnails.small > li > .thumbnail > a {
-    height: 75px;
-    width: 75px;
-    text-align: center;
-    display: table-cell;
-    vertical-align: middle;
-}
-
-.thumbnails.small > li > .thumbnail > button {
-    height: 75px;
-    width: 75px;
-    text-align: center;
-    display: table-cell;
-    vertical-align: middle;
-}
-
-.my-markdown {
-    padding: 3px;
-    background: #EEE;
-    border-radius: 3px;
-}
-
-.md-title {
-    font-size: 16px;
-    line-height: 20px;
-    font-weight: bold;
-    padding: 10px 10px;
-    color: #555;
-    text-shadow: 1px solid #CACACA;
-    border-bottom: 0 none;
-    background-color: #eaeaea;
-    background-image: linear-gradient(#fafafa, #eaeaea);
-    background-repeat: repeat-x;
-    display: block;
-}
-
-.md-body {
-    background-color: #fff;
-    border: 1px solid #CACACA;
-    padding: 30px;
-    font-size: 15px;
-    line-height: 1.7;
-    color: #333333;
-}
-
-.widget-box {
-    background: none repeat scroll 0 0 #F9F9F9;
-    border-top: 1px solid #CDCDCD;
-    border-left: 1px solid #CDCDCD;
-    border-right: 1px solid #CDCDCD;
-    clear: both;
-    margin-top: 16px;
-    margin-bottom: 16px;
-    position: relative;
-}
-
-/* widgets from unicorn theme from http://wbpreview.com/previews/WB0F35928/widgets.html */
-.widget-title, .modal-header, .table th, div.dataTables_wrapper .ui-widget-header, .ui-dialog .ui-dialog-titlebar {
-    background-color: #efefef;
-    background-image: -webkit-gradient(linear, 0 0%, 0 100%, from(#fdfdfd), to(#eaeaea));
-    background-image: -webkit-linear-gradient(top, #fdfdfd 0%, #eaeaea 100%);
-    border-bottom: 1px solid #CDCDCD;
-    height: 36px;
-}
-
-.widget-title .nav-tabs {
-    border-bottom: 0 none;
-}
-
-.widget-title .nav-tabs li a {
-    border-bottom: medium none !important;
-    border-left: 1px solid #DDDDDD;
-    border-radius: 0 0 0 0;
-    border-right: 1px solid #DDDDDD;
-    border-top: medium none;
-    color: #999999;
-    margin: 0;
-    outline: medium none;
-    padding: 9px 10px 8px;
-    font-weight: bold;
-    text-shadow: 0 1px 0 #FFFFFF;
-}
-
-.widget-title .nav-tabs li:first-child a {
-    border-left: medium none !important;
-}
-
-.widget-title .nav-tabs li a:hover {
-    background-color: transparent !important;
-    border-color: #D6D6D6;
-    border-width: 0 1px;
-    color: #666666;
-}
-
-.widget-title .nav-tabs li.active a {
-    background-color: #F9F9F9 !important;
-    color: #444444;
-}
-
-.widget-title span.icon {
-    border-right: 1px solid #cdcdcd;
-    padding: 9px 10px 7px 11px;
-    float: left;
-    opacity: .7;
-}
-
-.widget-title h5 {
-    color: #666666;
-    text-shadow: 0 1px 0 #ffffff;
-    float: left;
-    font-size: 12px;
-    font-weight: bold;
-    padding: 12px;
-    line-height: 12px;
-    margin: 0;
-}
-
-.widget-title .buttons {
-    float: right;
-    margin: 8px 10px 0 0;
-}
-
-.widget-title .label {
-    padding: 3px 5px 2px;
-    float: right;
-    margin: 9px 15px 0 0;
-    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3) inset, 0 1px 0 #ffffff;
-}
-
-.widget-content {
-    padding: 12px 15px;
-    border-bottom: 1px solid #cdcdcd;
-}
-
-.widget-box.widget-plain .widget-content {
-    padding: 12px 0 0;
-}
-
-.widget-box.collapsible .collapse.in .widget-content {
-    border-bottom: 1px solid #CDCDCD;
-}
-
-.nopadding {
-    padding: 0 !important;
-}
-
-.nopadding .table {
-    margin-bottom: 0;
-}
-
-.nopadding .table-bordered {
-    border: 0;
-}
-
-.user-info {
-    color: #666666;
-    font-size: 11px;
-}
diff --git a/brewman/static/partial/account-detail.html b/brewman/static/partial/account-detail.html
index ba897de6..88f4119a 100644
--- a/brewman/static/partial/account-detail.html
+++ b/brewman/static/partial/account-detail.html
@@ -12,7 +12,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-10">
-            <input type="text" id="txtName" class="form-control" ng-model="account.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="account.Name" focus-on="foName"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/attendance.html b/brewman/static/partial/attendance.html
index fa57264f..6b995939 100644
--- a/brewman/static/partial/attendance.html
+++ b/brewman/static/partial/attendance.html
@@ -7,7 +7,7 @@
         <div class="col-md-8">
             <div class="input-group">
                 <input class="form-control" id="txtDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="dOpen" ng-focus="dOpen = true" ng-model="info.Date"/>
+                       is-open="dOpen" ng-focus="dOpen = true" ng-model="info.Date" focus-on="foDate" />
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/balance-sheet.html b/brewman/static/partial/balance-sheet.html
index 33ee042c..f0b1ed96 100644
--- a/brewman/static/partial/balance-sheet.html
+++ b/brewman/static/partial/balance-sheet.html
@@ -7,7 +7,7 @@
         <div class="col-md-8">
             <div class="input-group">
                 <input type="text" class="form-control" id="txtDate" datepicker-popup="dd-MMM-yyyy"
-                       is-open="dOpen" ng-focus="dOpen = true" ng-model="info.Date"/>
+                       is-open="dOpen" ng-focus="dOpen = true" ng-model="info.Date" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/cash-flow.html b/brewman/static/partial/cash-flow.html
index f5c3a946..0701c88c 100644
--- a/brewman/static/partial/cash-flow.html
+++ b/brewman/static/partial/cash-flow.html
@@ -7,7 +7,7 @@
         <div class="col-md-4">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/client-detail.html b/brewman/static/partial/client-detail.html
index 7eb434de..b9ad6ce0 100644
--- a/brewman/static/partial/client-detail.html
+++ b/brewman/static/partial/client-detail.html
@@ -12,7 +12,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-10">
-            <input type="text" id="txtName" class="form-control" ng-model="client.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="client.Name" focus-on="foName"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/closing-stock.html b/brewman/static/partial/closing-stock.html
index c6a1fccf..201544e2 100644
--- a/brewman/static/partial/closing-stock.html
+++ b/brewman/static/partial/closing-stock.html
@@ -7,7 +7,7 @@
         <div class="col-md-8">
             <div class="input-group">
                 <input type="text" class="form-control" id="txtDate" datepicker-popup="dd-MMM-yyyy"
-                       is-open="dOpen" ng-focus="dOpen = true" ng-model="info.Date"/>
+                       is-open="dOpen" ng-focus="dOpen = true" ng-model="info.Date" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/cost-center-detail.html b/brewman/static/partial/cost-center-detail.html
index 49efce9a..ac44f25a 100644
--- a/brewman/static/partial/cost-center-detail.html
+++ b/brewman/static/partial/cost-center-detail.html
@@ -5,7 +5,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-10">
-            <input type="text" id="txtName" class="form-control" ng-model="costCenter.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="costCenter.Name" focus-on="foName"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/daybook.html b/brewman/static/partial/daybook.html
index ace5f535..f2d74d2c 100644
--- a/brewman/static/partial/daybook.html
+++ b/brewman/static/partial/daybook.html
@@ -7,7 +7,7 @@
         <div class="col-md-4">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/employee-attendance.html b/brewman/static/partial/employee-attendance.html
index 68a12a0e..c4f5f47e 100644
--- a/brewman/static/partial/employee-attendance.html
+++ b/brewman/static/partial/employee-attendance.html
@@ -30,7 +30,7 @@
             <div class="input-group">
                 <input type="text" id="txtEmployee" class="form-control" ng-model="info.Employee"
                        typeahead="employee as employee.Name for employee in employees($viewValue)"
-                       typeahead-editable="false" on-return="show()"/>
+                       typeahead-editable="false" on-return="show()" focus-on="foEmployee"/>
                     <span class="input-group-btn">
                         <button class="btn btn-info" ng-click="show()">Show <i class="glyphicon glyphicon-eye-open"></i>
                         </button>
diff --git a/brewman/static/partial/employee-detail.html b/brewman/static/partial/employee-detail.html
index e931d847..92335449 100644
--- a/brewman/static/partial/employee-detail.html
+++ b/brewman/static/partial/employee-detail.html
@@ -12,7 +12,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-10">
-            <input type="text" id="txtName" class="form-control" ng-model="employee.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="employee.Name" focus-on="foName"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/group-detail.html b/brewman/static/partial/group-detail.html
index f7a02eeb..46deb388 100644
--- a/brewman/static/partial/group-detail.html
+++ b/brewman/static/partial/group-detail.html
@@ -5,7 +5,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-10">
-            <input type="text" id="txtName" class="form-control" ng-model="group.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="group.Name" focus-on="foName"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/issue.html b/brewman/static/partial/issue.html
index 8062168b..65980ca2 100644
--- a/brewman/static/partial/issue.html
+++ b/brewman/static/partial/issue.html
@@ -47,7 +47,7 @@
         <div class="col-md-5">
             <input type="text" id="txtBatch" class="form-control" ng-model="batch"
                    typeahead="batch as batch.Name for batch in batches($viewValue)"
-                   typeahead-editable="false"/>
+                   typeahead-editable="false" focus-on="foBatch"/>
         </div>
         <div class="col-md-5">
             <div class="input-group">
diff --git a/brewman/static/partial/journal.html b/brewman/static/partial/journal.html
index 8c16b25c..0d8ce0f4 100644
--- a/brewman/static/partial/journal.html
+++ b/brewman/static/partial/journal.html
@@ -7,7 +7,7 @@
         <div class="col-md-10">
             <div class="input-group">
                 <input class="form-control" id="txtDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="dOpen" ng-focus="dOpen = true" ng-model="voucher.Date"/>
+                       is-open="dOpen" ng-focus="dOpen = true" ng-model="voucher.Date" focus-on="foAccount"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/ledger.html b/brewman/static/partial/ledger.html
index f49ddb35..35f90deb 100644
--- a/brewman/static/partial/ledger.html
+++ b/brewman/static/partial/ledger.html
@@ -30,7 +30,7 @@
             <div class="input-group">
                 <input type="text" id="txtLedger" class="form-control" ng-model="info.Ledger"
                        typeahead="account as account.Name for account in accounts($viewValue)"
-                       typeahead-editable="false" on-return="show()"/>
+                       typeahead-editable="false" on-return="show()" focus-on="foLedger"/>
                     <span class="input-group-btn">
                         <button class="btn btn-info" ng-click="show()">Show <i class="glyphicon glyphicon-eye-open"></i>
                         </button>
@@ -38,7 +38,7 @@
             </div>
         </div>
     </div>
-    <table id="gvGrid" class="table table-condensed table-bordered table-striped" keypress="shortcuts">
+    <table class="table table-condensed table-bordered table-striped" keypress="shortcuts" focus-on="foGrid">
         <thead>
         <tr>
             <th>Date</th>
diff --git a/brewman/static/partial/login.html b/brewman/static/partial/login.html
index 6acf26bd..9c81060e 100644
--- a/brewman/static/partial/login.html
+++ b/brewman/static/partial/login.html
@@ -6,7 +6,7 @@
 
         <div class="col-md-10">
             <input type="text" class="form-control" ng-model="username" id="username" required placeholder="Username"
-                   autofocus/>
+                   autofocus focus-on="foUsername"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/message-detail.html b/brewman/static/partial/message-detail.html
index fe4b3685..678a70c6 100644
--- a/brewman/static/partial/message-detail.html
+++ b/brewman/static/partial/message-detail.html
@@ -6,7 +6,7 @@
 
         <div class="col-md-10">
             <input type="text" id="txtTitle" class="form-control" ng-model="message.Title"
-                   ng-disabled="message.ThreadID"/>
+                   ng-disabled="message.ThreadID" focus-on="foTitle"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/net-transactions.html b/brewman/static/partial/net-transactions.html
index 901f2a4d..942ac8ba 100644
--- a/brewman/static/partial/net-transactions.html
+++ b/brewman/static/partial/net-transactions.html
@@ -7,7 +7,7 @@
         <div class="col-md-4">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/payment.html b/brewman/static/partial/payment.html
index 8158b739..3dc80467 100644
--- a/brewman/static/partial/payment.html
+++ b/brewman/static/partial/payment.html
@@ -30,7 +30,7 @@
         <div class="col-md-6">
             <input type="text" id="txtAccount" class="form-control" ng-model="account"
                    typeahead="account as account.Name for account in accounts($viewValue)"
-                   typeahead-editable="false"/>
+                   typeahead-editable="false" focus-on="foAccount"/>
         </div>
         <div class="col-md-4">
             <div class="input-group">
diff --git a/brewman/static/partial/product-detail.html b/brewman/static/partial/product-detail.html
index 3cb77b81..22f2b1b5 100644
--- a/brewman/static/partial/product-detail.html
+++ b/brewman/static/partial/product-detail.html
@@ -12,7 +12,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-10">
-            <input type="text" id="txtName" class="form-control" ng-model="product.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="product.Name" focus-on="foName"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/product-group-detail.html b/brewman/static/partial/product-group-detail.html
index 1c9d8787..0306b89e 100644
--- a/brewman/static/partial/product-group-detail.html
+++ b/brewman/static/partial/product-group-detail.html
@@ -5,7 +5,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-10">
-            <input type="text" id="txtName" class="form-control" ng-model="productGroup.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="productGroup.Name" focus-on="foName"/>
         </div>
     </div>
     <div class="form-group">
diff --git a/brewman/static/partial/product-ledger.html b/brewman/static/partial/product-ledger.html
index 1a3fa97c..9b9f61af 100644
--- a/brewman/static/partial/product-ledger.html
+++ b/brewman/static/partial/product-ledger.html
@@ -7,7 +7,7 @@
         <div class="col-md-5">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foProduct"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/profit-loss.html b/brewman/static/partial/profit-loss.html
index f9e2d7cd..9b31f3c6 100644
--- a/brewman/static/partial/profit-loss.html
+++ b/brewman/static/partial/profit-loss.html
@@ -7,7 +7,7 @@
         <div class="col-md-4">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/purchase-entries.html b/brewman/static/partial/purchase-entries.html
index c280166b..db3b3607 100644
--- a/brewman/static/partial/purchase-entries.html
+++ b/brewman/static/partial/purchase-entries.html
@@ -7,7 +7,7 @@
         <div class="col-md-4">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/purchase-return.html b/brewman/static/partial/purchase-return.html
index b5225af5..68c72d8a 100644
--- a/brewman/static/partial/purchase-return.html
+++ b/brewman/static/partial/purchase-return.html
@@ -30,7 +30,7 @@
         <div class="col-md-6">
             <input type="text" id="txtBatch" class="form-control" ng-model="batch"
                    typeahead="batch as batch.Name for batch in batches($viewValue)"
-                   typeahead-editable="false"/>
+                   typeahead-editable="false" focus-on="foBatch"/>
         </div>
         <div class="col-md-4">
             <div class="input-group">
diff --git a/brewman/static/partial/purchase.html b/brewman/static/partial/purchase.html
index d1f9b1ba..0cb0508f 100644
--- a/brewman/static/partial/purchase.html
+++ b/brewman/static/partial/purchase.html
@@ -29,7 +29,7 @@
         <div class="col-md-4">
             <input type="text" id="txtProduct" class="form-control" ng-model="product"
                    typeahead="product as product.Name for product in products($viewValue)"
-                   typeahead-editable="false" on-return="add()"/>
+                   typeahead-editable="false" on-return="add()" focus-on="foProduct"/>
         </div>
         <div class="col-md-2">
             <input type="text" class="form-control" placeholder="Quantity" ng-model="quantity" on-return="add()"/>
diff --git a/brewman/static/partial/raw-material-cost-detail.html b/brewman/static/partial/raw-material-cost-detail.html
index abe28f87..9b1b16ed 100644
--- a/brewman/static/partial/raw-material-cost-detail.html
+++ b/brewman/static/partial/raw-material-cost-detail.html
@@ -7,7 +7,7 @@
         <div class="col-md-4">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/raw-material-cost.html b/brewman/static/partial/raw-material-cost.html
index ff359e0b..adfb1633 100644
--- a/brewman/static/partial/raw-material-cost.html
+++ b/brewman/static/partial/raw-material-cost.html
@@ -7,7 +7,7 @@
         <div class="col-md-4">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/receipt.html b/brewman/static/partial/receipt.html
index 88d647d3..e4cbd6f9 100644
--- a/brewman/static/partial/receipt.html
+++ b/brewman/static/partial/receipt.html
@@ -30,7 +30,7 @@
         <div class="col-md-6">
             <input type="text" id="txtAccount" class="form-control" ng-model="account"
                    typeahead="account as account.Name for account in accounts($viewValue)"
-                   typeahead-editable="false"/>
+                   typeahead-editable="false" focus-on="foAccount"/>
         </div>
         <div class="col-md-4">
             <div class="input-group">
diff --git a/brewman/static/partial/recipe-detail.html b/brewman/static/partial/recipe-detail.html
index bf59540d..f1753822 100644
--- a/brewman/static/partial/recipe-detail.html
+++ b/brewman/static/partial/recipe-detail.html
@@ -5,7 +5,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-4">
-            <input type="text" id="txtName" class="form-control" ng-model="recipe.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="recipe.Name" focus-on="foName"/>
         </div>
         <div class="col-md-2">
             <input type="text" class="form-control" ng-model="recipe.Quantity" placeholder="Quantity"/>
@@ -56,7 +56,7 @@
         <div class="col-md-5">
             <input type="text" id="txtProduct" class="form-control" ng-model="product"
                    typeahead="product as product.Name for product in products($viewValue)"
-                   typeahead-editable="false" on-return="add()"/>
+                   typeahead-editable="false" on-return="add()" focus-on="foProduct"/>
         </div>
         <div class="col-md-2">
             <div class="input-group">
diff --git a/brewman/static/partial/reconcile.html b/brewman/static/partial/reconcile.html
index a78088f0..4dff2370 100644
--- a/brewman/static/partial/reconcile.html
+++ b/brewman/static/partial/reconcile.html
@@ -30,7 +30,7 @@
             <div class="input-group">
                 <input type="text" id="txtLedger" class="form-control" ng-model="info.Account"
                        typeahead="account as account.Name for account in accounts($viewValue)"
-                       typeahead-editable="false" on-return="show()" typeahead-min-length="0"/>
+                       typeahead-editable="false" on-return="show()" typeahead-min-length="0" focus-on="foLedger"/>
                     <span class="input-group-btn">
                         <button class="btn btn-info" ng-click="show()">Show <i class="glyphicon glyphicon-eye-open"></i>
                         </button>
@@ -38,7 +38,7 @@
             </div>
         </div>
     </div>
-    <table id="gvGrid" class="table table-condensed table-bordered table-striped">
+    <table class="table table-condensed table-bordered table-striped" focus-on="foGrid">
         <thead>
         <tr>
             <th>Date</th>
diff --git a/brewman/static/partial/salary-deduction.html b/brewman/static/partial/salary-deduction.html
index 3171d970..571287d5 100644
--- a/brewman/static/partial/salary-deduction.html
+++ b/brewman/static/partial/salary-deduction.html
@@ -20,7 +20,7 @@
         <div class="col-md-5">
             <input type="text" id="txtEmployee" class="form-control" ng-model="employee"
                    typeahead="employee as employee.Name for employee in employees($viewValue)"
-                   typeahead-editable="false"/>
+                   typeahead-editable="false" focus-on="foEmployee"/>
         </div>
         <div class="col-md-2">
             <input type="text" class="form-control" placeholder="Gross Salary" ng-model="grossSalary"/>
diff --git a/brewman/static/partial/stock-movement.html b/brewman/static/partial/stock-movement.html
index 9ddf0904..f524c368 100644
--- a/brewman/static/partial/stock-movement.html
+++ b/brewman/static/partial/stock-movement.html
@@ -7,7 +7,7 @@
         <div class="col-md-4">
             <div class="input-group">
                 <input class="form-control" id="txtStartDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate"/>
+                       is-open="sdOpen" ng-focus="sdOpen = true" ng-model="info.StartDate" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/trial-balance.html b/brewman/static/partial/trial-balance.html
index 6286cc54..101b71b8 100644
--- a/brewman/static/partial/trial-balance.html
+++ b/brewman/static/partial/trial-balance.html
@@ -7,7 +7,7 @@
         <div class="col-md-8">
             <div class="input-group">
                 <input class="form-control" id="txtDate" type="text" datepicker-popup="dd-MMM-yyyy"
-                       is-open="dOpen" ng-focus="dOpen = true" ng-model="info.Date"/>
+                       is-open="dOpen" ng-focus="dOpen = true" ng-model="info.Date" focus-on="foDate"/>
                 <span class="input-group-btn">
                     <button class="btn btn-default"><i class="glyphicon glyphicon-calendar"></i></button>
                 </span>
diff --git a/brewman/static/partial/user-detail.html b/brewman/static/partial/user-detail.html
index 2ce76dca..8f1aa93c 100644
--- a/brewman/static/partial/user-detail.html
+++ b/brewman/static/partial/user-detail.html
@@ -5,7 +5,7 @@
         <label for="txtName" class="col-md-2 control-label">Name</label>
 
         <div class="col-md-10">
-            <input type="text" id="txtName" class="form-control" ng-model="user.Name"/>
+            <input type="text" id="txtName" class="form-control" ng-model="user.Name" focus-on="foName"/>
         </div>
     </div>
 
diff --git a/brewman/static/scripts/account.js b/brewman/static/scripts/account.js
index 1e0858c5..98534cd9 100644
--- a/brewman/static/scripts/account.js
+++ b/brewman/static/scripts/account.js
@@ -120,7 +120,7 @@ var AccountController = ['$scope', '$location', '$modal', 'account', 'accountTyp
             $scope.delete();
         });
     };
-    $('#txtName').focus();
+    $scope.foName = true;
 }];
 
 AccountController.resolve = {
diff --git a/brewman/static/scripts/angular_directive.js b/brewman/static/scripts/angular_directive.js
index d9a9d36e..5a809e27 100644
--- a/brewman/static/scripts/angular_directive.js
+++ b/brewman/static/scripts/angular_directive.js
@@ -153,7 +153,7 @@ overlordDirective.directive('onReturn', ['$parse', function ($parse) {
 
 
 overlordDirective.directive('tanSse', ['$parse', function ($parse) {
-    return{
+    return {
         restrict: 'EM',
         link: function ($scope, element, attrs) {
             var url = attrs.url,
@@ -371,9 +371,28 @@ overlordDirective.directive('fileUpload', function () {
                 //iterate files since 'multiple' may be specified on the element
                 for (var i = 0; i < files.length; i++) {
                     //emit event upward
-                    scope.$emit("fileSelected", { file: files[i] });
+                    scope.$emit("fileSelected", {file: files[i]});
                 }
             });
         }
     };
 });
+
+overlordDirective.directive('focusOn', ['$timeout', function ($timeout) {
+    return {
+        restrict: 'A',
+        scope: {
+            focusOn: '='
+        },
+        link: function (scope, element, attrs) {
+            scope.$watch('focusOn', function (value) {
+                if (value === true) {
+                    //$timeout(function () {
+                    element[0].focus();
+                    scope.focusOn = false;
+                    //});
+                }
+            });
+        }
+    };
+}]);
\ No newline at end of file
diff --git a/brewman/static/scripts/attendance.js b/brewman/static/scripts/attendance.js
index 1ec038cf..c2690ce1 100644
--- a/brewman/static/scripts/attendance.js
+++ b/brewman/static/scripts/attendance.js
@@ -15,7 +15,7 @@ var AttendanceController = ['$scope', '$location', 'asDateFilter', 'Attendance',
             $scope.toasts.push({Type: 'Danger', Message: data.data});
         });
     };
-    $('#txtDate').focus();
+    $scope.foDate = true;
 }];
 
 var AttendanceSubController = ['$scope', function ($scope) {
diff --git a/brewman/static/scripts/balance-sheet.js b/brewman/static/scripts/balance-sheet.js
index 9129fc19..56b9cd4d 100644
--- a/brewman/static/scripts/balance-sheet.js
+++ b/brewman/static/scripts/balance-sheet.js
@@ -6,7 +6,7 @@ var BalanceSheetController = ['$scope', '$location', 'asDateFilter', 'info', fun
         var date = asDate($scope.info.Date);
         $location.path('/BalanceSheet/' + date);
     };
-    $('#txtStartDate').focus();
+    $scope.foDate = true;
 }];
 
 BalanceSheetController.resolve = {
diff --git a/brewman/static/scripts/cash-flow.js b/brewman/static/scripts/cash-flow.js
index de89ce58..d2f3fc01 100644
--- a/brewman/static/scripts/cash-flow.js
+++ b/brewman/static/scripts/cash-flow.js
@@ -7,7 +7,7 @@ var CashFlowController = ['$scope', '$routeParams', '$location', 'asDateFilter',
             finishDate = asDate($scope.info.FinishDate);
         $location.path('/CashFlow').search({StartDate: startDate, FinishDate: finishDate});
     };
-    $('#txtStartDate').focus();
+    $scope.foDate = true;
 }];
 CashFlowController.resolve = {
     cashFlow: ['$route', 'CashFlow', function ($route, CashFlow) {
diff --git a/brewman/static/scripts/client.js b/brewman/static/scripts/client.js
index 7f56e0e7..372467b5 100644
--- a/brewman/static/scripts/client.js
+++ b/brewman/static/scripts/client.js
@@ -51,7 +51,7 @@ var ClientController = ['$scope', '$location', '$modal', 'client', function ($sc
             $scope.delete();
         });
     };
-    $('#txtName').focus();
+    $scope.foName = true;
 }];
 
 ClientController.resolve = {
diff --git a/brewman/static/scripts/closing-stock.js b/brewman/static/scripts/closing-stock.js
index c330f896..c6399937 100644
--- a/brewman/static/scripts/closing-stock.js
+++ b/brewman/static/scripts/closing-stock.js
@@ -6,7 +6,7 @@ var ClosingStockController = ['$scope', '$location', 'asDateFilter', 'info', fun
         var date = asDate($scope.info.Date);
         $location.path('/ClosingStock/' + date);
     };
-    $('#txtDate').focus();
+    $scope.foDate = true;
 }];
 
 ClosingStockController.resolve = {
diff --git a/brewman/static/scripts/cost-center.js b/brewman/static/scripts/cost-center.js
index 312b0b2f..90e4f6ec 100644
--- a/brewman/static/scripts/cost-center.js
+++ b/brewman/static/scripts/cost-center.js
@@ -30,7 +30,7 @@ var CostCenterController = ['$scope', '$routeParams', '$location', 'costCenter',
             $scope.toasts.push({Type: 'Danger', Message: data.data});
         });
     };
-    $('#txtName').focus();
+    $scope.foName = true;
 }];
 
 CostCenterController.resolve = {
diff --git a/brewman/static/scripts/daybook.js b/brewman/static/scripts/daybook.js
index ca8d54b3..27a18aef 100644
--- a/brewman/static/scripts/daybook.js
+++ b/brewman/static/scripts/daybook.js
@@ -7,7 +7,7 @@ var DaybookController = ['$scope', '$location', 'asDateFilter', 'info', function
             finishDate = asDate($scope.info.FinishDate);
         $location.path('/Daybook').search({StartDate: startDate, FinishDate: finishDate});
     };
-    $('#txtStartDate').focus();
+    $scope.foDate = true;
 }];
 DaybookController.resolve = {
     info: ['$route', 'Daybook', function ($route, Daybook) {
diff --git a/brewman/static/scripts/employee-attendance.js b/brewman/static/scripts/employee-attendance.js
index bcafee03..d6f0d637 100644
--- a/brewman/static/scripts/employee-attendance.js
+++ b/brewman/static/scripts/employee-attendance.js
@@ -28,7 +28,7 @@ var EmployeeAttendanceController = ['$scope', '$location', '$routeParams', 'asDa
             $scope.toasts.push({Type: 'Danger', Message: data.data});
         });
     };
-    $('#txtEmployee').focus();
+    $scope.foEmployee = true;
 }];
 
 var EmployeeAttendanceSubController = ['$scope', function ($scope) {
diff --git a/brewman/static/scripts/employee.js b/brewman/static/scripts/employee.js
index 935d0065..3d4d7d94 100644
--- a/brewman/static/scripts/employee.js
+++ b/brewman/static/scripts/employee.js
@@ -124,8 +124,7 @@ var EmployeeController = ['$scope', '$routeParams', '$location', 'asDateFilter',
             $scope.delete();
         });
     };
-
-    $('#txtName').focus();
+    $scope.foName = true;
 }];
 
 EmployeeController.resolve = {
diff --git a/brewman/static/scripts/group.js b/brewman/static/scripts/group.js
index 5073fb4e..a2bd1be7 100644
--- a/brewman/static/scripts/group.js
+++ b/brewman/static/scripts/group.js
@@ -30,7 +30,7 @@ var GroupController = ['$scope', '$location', 'group', function ($scope, $locati
             $scope.toasts.push({Type: 'Danger', Message: data.data});
         });
     };
-    $('#txtName').focus();
+    $scope.foName = true;
 }];
 
 GroupController.resolve = {
diff --git a/brewman/static/scripts/issue.js b/brewman/static/scripts/issue.js
index 1430d083..81be1272 100644
--- a/brewman/static/scripts/issue.js
+++ b/brewman/static/scripts/issue.js
@@ -33,7 +33,7 @@ var IssueController = ['$scope', '$routeParams', '$location', 'asDateFilter', 'v
             oldInventory.Quantity += quantity;
             delete $scope.batch;
             delete $scope.quantity;
-            $('#txtBatch').focus();
+            $scope.foBatch = true;
         }
 
         if (angular.isUndefined(oldInventory) && (!consumption || quantity <= $scope.batch.QuantityRemaining)) {
@@ -49,7 +49,7 @@ var IssueController = ['$scope', '$routeParams', '$location', 'asDateFilter', 'v
                 });
             delete $scope.batch;
             delete $scope.quantity;
-            $('#txtBatch').focus();
+            $scope.foBatch = true;
         }
     };
     $scope.removeInventory = function (inventory) {
diff --git a/brewman/static/scripts/journal.js b/brewman/static/scripts/journal.js
index e7a9b39f..7e61c3fc 100644
--- a/brewman/static/scripts/journal.js
+++ b/brewman/static/scripts/journal.js
@@ -1,7 +1,7 @@
 'use strict';
 
 var JournalController = ['$scope', '$location', 'asDateFilter', '$modal', 'uploadedImageResizer', 'voucher', 'Account', function ($scope, $location, asDate, $modal, uploadedImageResizer, voucher, Account) {
-    $('#txtAccount').focus();
+    $scope.foAccount = true;
 
     $scope.voucher = voucher;
     $scope.debit = 1;
@@ -53,7 +53,7 @@ var JournalController = ['$scope', '$location', 'asDateFilter', '$modal', 'uploa
         }
         delete $scope.account;
         delete $scope.amount;
-        $('#txtAccount').focus();
+        $scope.foAccount = true;
     };
 
     $scope.removeJournal = function (journal) {
diff --git a/brewman/static/scripts/ledger.js b/brewman/static/scripts/ledger.js
index 765255ad..7ae22923 100644
--- a/brewman/static/scripts/ledger.js
+++ b/brewman/static/scripts/ledger.js
@@ -25,9 +25,9 @@ var LedgerController = ['$scope', '$routeParams', '$location', 'asDateFilter', '
     };
 
     if ($routeParams.id) {
-        $('#gvGrid').focus();
+        $scope.foGrid = true;
     } else {
-        $('#txtLedger').focus();
+        $scope.foLedger = true;
     }
 
     $scope.selected = -1;
diff --git a/brewman/static/scripts/login.js b/brewman/static/scripts/login.js
index 2b95bf48..8d40df29 100644
--- a/brewman/static/scripts/login.js
+++ b/brewman/static/scripts/login.js
@@ -29,7 +29,7 @@ var LoginController = ['$scope', '$http', '$location', '$routeParams', '$cookieS
                 $scope.toasts.push({Type: 'Danger', Message: data});
             });
     };
-    $('#username').focus();
+    $scope.foUsername = true;
 }];
 
 var LogoutController = ['$scope', '$http', '$location', function ($scope, $http, $location) {
diff --git a/brewman/static/scripts/message.js b/brewman/static/scripts/message.js
index 839da4a4..0145e83f 100644
--- a/brewman/static/scripts/message.js
+++ b/brewman/static/scripts/message.js
@@ -33,7 +33,7 @@ var MessageController = ['$scope', '$location', 'asDateFilter', 'message', 'tags
             $scope.toasts.push({Type: 'Danger', Message: data.data});
         });
     };
-    $('#txtTitle').focus();
+    $scope.foTitle = true;
 }];
 
 MessageController.resolve = {
diff --git a/brewman/static/scripts/net-transactions.js b/brewman/static/scripts/net-transactions.js
index 1fed5ef4..60c9a776 100644
--- a/brewman/static/scripts/net-transactions.js
+++ b/brewman/static/scripts/net-transactions.js
@@ -7,7 +7,7 @@ var NetTransactionsController = ['$scope', '$location', 'asDateFilter', 'netTran
             finishDate = asDate($scope.info.FinishDate);
         $location.path('/NetTransactions').search({StartDate: startDate, FinishDate: finishDate});
     };
-    $('#txtStartDate').focus();
+    $scope.foDate = true;
 }];
 
 NetTransactionsController.resolve = {
diff --git a/brewman/static/scripts/payment.js b/brewman/static/scripts/payment.js
index 61e9a0f1..ac3b52a8 100644
--- a/brewman/static/scripts/payment.js
+++ b/brewman/static/scripts/payment.js
@@ -1,7 +1,7 @@
 'use strict';
 
 var PaymentController = ['$scope', '$location', 'asDateFilter', '$modal', 'uploadedImageResizer', 'voucher', 'ledgers', 'Account', function ($scope, $location, asDate, $modal, uploadedImageResizer, voucher, ledgers, Account) {
-    $('#txtAccount').focus();
+    $scope.foAccount = true;
 
     $scope.voucher = voucher;
     $scope.ledgers = ledgers;
@@ -50,7 +50,7 @@ var PaymentController = ['$scope', '$location', 'asDateFilter', '$modal', 'uploa
         }
         delete $scope.account;
         delete $scope.amount;
-        $('#txtAccount').focus();
+        $scope.foAccount = true;
     };
 
     $scope.removeJournal = function (journal) {
diff --git a/brewman/static/scripts/product-group.js b/brewman/static/scripts/product-group.js
index d71a2b89..e9a67f08 100644
--- a/brewman/static/scripts/product-group.js
+++ b/brewman/static/scripts/product-group.js
@@ -30,7 +30,7 @@ var ProductGroupController = ['$scope', '$location', 'productGroup', function ($
             $scope.toasts.push({Type: 'Danger', Message: data.data});
         });
     };
-    $('#txtName').focus();
+    $scope.foName = true;
 }];
 
 ProductGroupController.resolve = {
diff --git a/brewman/static/scripts/product-ledger.js b/brewman/static/scripts/product-ledger.js
index b4f03fc2..81141920 100644
--- a/brewman/static/scripts/product-ledger.js
+++ b/brewman/static/scripts/product-ledger.js
@@ -24,8 +24,7 @@ var ProductLedgerController = ['$scope', '$routeParams', '$location', 'asDateFil
     $scope.products = function ($viewValue) {
         return Product.autocomplete({term: $viewValue, count: 20}).$promise;
     };
-
-    $('#txtProduct').focus();
+    $scope.foProduct = true;
 }];
 ProductLedgerController.resolve = {
     productLedger: ['$route', 'ProductLedger', function ($route, ProductLedger) {
diff --git a/brewman/static/scripts/product.js b/brewman/static/scripts/product.js
index dd981dc5..d2f7f839 100644
--- a/brewman/static/scripts/product.js
+++ b/brewman/static/scripts/product.js
@@ -128,8 +128,7 @@ var ProductController = ['$scope', '$location', '$window', '$modal', 'product',
             $scope.delete();
         });
     };
-
-    $('#txtName').focus();
+    $scope.foName = true;
 }];
 
 ProductController.resolve = {
diff --git a/brewman/static/scripts/profit-loss.js b/brewman/static/scripts/profit-loss.js
index bcd6cd86..ca99085b 100644
--- a/brewman/static/scripts/profit-loss.js
+++ b/brewman/static/scripts/profit-loss.js
@@ -7,7 +7,7 @@ var ProfitLossController = ['$scope', '$location', 'asDateFilter', 'profit_loss'
             finishDate = asDate($scope.info.FinishDate);
         $location.path('/ProfitLoss').search({StartDate: startDate, FinishDate: finishDate});
     };
-    $('#txtStartDate').focus();
+    $scope.foDate = true;
 }];
 
 ProfitLossController.resolve = {
diff --git a/brewman/static/scripts/purchase-entries.js b/brewman/static/scripts/purchase-entries.js
index 2162f0d4..c186aaae 100644
--- a/brewman/static/scripts/purchase-entries.js
+++ b/brewman/static/scripts/purchase-entries.js
@@ -8,7 +8,7 @@ var PurchaseEntriesController = ['$scope', '$location', 'asDateFilter', 'purchas
             finishDate = asDate($scope.info.FinishDate);
         $location.path('/PurchaseEntries').search({StartDate: startDate, FinishDate: finishDate});
     };
-    $('#txtStartDate').focus();
+    $scope.foDate = true;
 }];
 
 PurchaseEntriesController.resolve = {
diff --git a/brewman/static/scripts/purchase-return.js b/brewman/static/scripts/purchase-return.js
index 979e92f1..e159fbed 100644
--- a/brewman/static/scripts/purchase-return.js
+++ b/brewman/static/scripts/purchase-return.js
@@ -53,8 +53,7 @@ var PurchaseReturnController = ['$scope', '$location', 'asDateFilter', '$modal',
                 });
             delete $scope.batch;
             delete $scope.quantity;
-            $('#txtBatch').val('');
-            $('#txtBatch').focus();
+            $scope.foBatch = true;
         }
     };
     $scope.removeInventory = function (inventory) {
diff --git a/brewman/static/scripts/purchase.js b/brewman/static/scripts/purchase.js
index b7ffcd40..55917015 100644
--- a/brewman/static/scripts/purchase.js
+++ b/brewman/static/scripts/purchase.js
@@ -56,7 +56,7 @@ var PurchaseController = ['$scope', '$location', 'asDateFilter', '$modal', 'uplo
             delete $scope.quantity;
             delete $scope.tax;
             delete $scope.discount;
-            $('#txtProduct').focus();
+            $scope.foProduct = true;
         }
     };
     $scope.removeInventory = function (inventory) {
diff --git a/brewman/static/scripts/raw-material-cost.js b/brewman/static/scripts/raw-material-cost.js
index 592c2a73..6d273c61 100644
--- a/brewman/static/scripts/raw-material-cost.js
+++ b/brewman/static/scripts/raw-material-cost.js
@@ -7,7 +7,7 @@ var RawMaterialCostController = ['$scope', '$location', 'asDateFilter', 'rawMate
             finishDate = asDate($scope.info.FinishDate);
         $location.path('/RawMaterialCost').search({StartDate: startDate, FinishDate: finishDate});
     };
-    $('#txtStartDate').focus();
+    $scope.foDate = true;
 }];
 
 RawMaterialCostController.resolve = {
diff --git a/brewman/static/scripts/receipt.js b/brewman/static/scripts/receipt.js
index 1ef2d0b3..790897c4 100644
--- a/brewman/static/scripts/receipt.js
+++ b/brewman/static/scripts/receipt.js
@@ -1,8 +1,7 @@
 'use strict';
 
 var ReceiptController = ['$scope', '$routeParams', '$location', 'asDateFilter', '$modal', 'uploadedImageResizer', 'voucher', 'ledgers', 'Voucher', 'Account', function ($scope, $routeParams, $location, asDate, $modal, uploadedImageResizer, voucher, ledgers, Voucher, Account) {
-    $('#txtAccount').focus();
-
+    $scope.foAccount = true;
     $scope.voucher = voucher;
     $scope.ledgers = ledgers;
     function getOld(ledgerID, journals) {
@@ -50,7 +49,7 @@ var ReceiptController = ['$scope', '$routeParams', '$location', 'asDateFilter',
         }
         delete $scope.account;
         delete $scope.amount;
-        $('#txtAccount').focus();
+        $scope.foAccount = true;
     };
 
     $scope.removeJournal = function (journal) {
diff --git a/brewman/static/scripts/recipe.js b/brewman/static/scripts/recipe.js
index c870a42d..8715c081 100644
--- a/brewman/static/scripts/recipe.js
+++ b/brewman/static/scripts/recipe.js
@@ -69,7 +69,7 @@ var RecipeController = ['$scope', '$location', '$window', '$modal', 'asDateFilte
         }
         delete $scope.quantity;
         delete $scope.product;
-        $('#txtProduct').focus();
+        $scope.foProduct = true;
     };
 
     $scope.removeItem = function (item) {
@@ -155,7 +155,7 @@ var RecipeController = ['$scope', '$location', '$window', '$modal', 'asDateFilte
             $scope.delete();
         });
     };
-    $('#txtName').focus();
+    $scope.foName = true;
 
     $scope.products = function ($viewValue) {
         return Product.autocomplete({term: $viewValue, count: 20, a: true, e: true, t: 'S'}).$promise;
diff --git a/brewman/static/scripts/reconcile.js b/brewman/static/scripts/reconcile.js
index 5026c3c1..3fc98a7a 100644
--- a/brewman/static/scripts/reconcile.js
+++ b/brewman/static/scripts/reconcile.js
@@ -36,9 +36,9 @@ var ReconcileController = ['$scope', '$routeParams', '$location', 'asDateFilter'
     };
 
     if ($routeParams.id) {
-        $('#gvGrid').focus();
+        $scope.foGrid = true;
     } else {
-        $('#txtLedger').focus();
+        $scope.foLedger = true;
     }
 
     $scope.selected = -1;
diff --git a/brewman/static/scripts/salary-deduction.js b/brewman/static/scripts/salary-deduction.js
index 6c754b6a..d63427c9 100644
--- a/brewman/static/scripts/salary-deduction.js
+++ b/brewman/static/scripts/salary-deduction.js
@@ -79,7 +79,7 @@ var SalaryDeductionController = ['$scope', '$location', 'asDateFilter', '$modal'
         delete $scope.employee;
         delete $scope.grossSalary;
         delete $scope.daysWorked;
-        $('#txtEmployee').focus();
+        $scope.foEmployee = true;
     };
 
     $scope.remove = function (deduction) {
diff --git a/brewman/static/scripts/stock-movement.js b/brewman/static/scripts/stock-movement.js
index bc25938b..a2c56683 100644
--- a/brewman/static/scripts/stock-movement.js
+++ b/brewman/static/scripts/stock-movement.js
@@ -7,7 +7,7 @@ var StockMovementController = ['$scope', '$location', 'asDateFilter', 'stockMove
             finishDate = asDate($scope.info.FinishDate);
         $location.path('/StockMovement').search({StartDate: startDate, FinishDate: finishDate});
     };
-    $('#txtStartDate').focus();
+    $scope.foDate = true;
 }];
 
 StockMovementController.resolve = {
diff --git a/brewman/static/scripts/trial-balance.js b/brewman/static/scripts/trial-balance.js
index 655c5dd2..4c6b7cc5 100644
--- a/brewman/static/scripts/trial-balance.js
+++ b/brewman/static/scripts/trial-balance.js
@@ -5,7 +5,7 @@ var TrialBalanceController = ['$scope', '$location', 'asDateFilter', 'trialBalan
     $scope.show = function () {
         $location.path('/TrialBalance/' + asDate($scope.info.Date));
     };
-    $('#txtDate').focus();
+    $scope.foDate = true;
 }];
 TrialBalanceController.resolve = {
     trialBalance: ['$route', 'TrialBalance', function ($route, TrialBalance) {
diff --git a/brewman/static/scripts/user.js b/brewman/static/scripts/user.js
index 1905ccf6..641108b2 100644
--- a/brewman/static/scripts/user.js
+++ b/brewman/static/scripts/user.js
@@ -30,7 +30,7 @@ var UserController = ['$scope', '$location', 'user', function ($scope, $location
             $scope.toasts.push({Type: 'Danger', Message: data.data});
         });
     };
-    $('#txtName').focus();
+    $scope.foName = true;
 }];
 
 UserController.resolve = {