diff --git a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
index a18b271..3d56b4f 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
+++ b/400-SOURCECODE/AIAHTML5.Web/app/controllers/DAController.js
@@ -2589,7 +2589,29 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
     }
 
     $scope.LayerChangeOnMouseUpDown = function (e) {
+        //'x' button is displaying inside the input box in IE browser.
+      
+        if (e.currentTarget.id == "incrmntVal") {
+
+            var layerInputVal = $("#txtlayerNumber").val();
+            if (layerInputVal != $rootScope.totalLayers) {
+                var layerInputValInc = parseInt(layerInputVal) + 1;
+                $scope.layerNumber = parseInt(layerInputValInc);
+                $("#txtlayerNumber").val($scope.layerNumber);
+            }
+
+        }
+        else {
 
+            var layerInputVal = $("#txtlayerNumber").val();
+            if (layerInputVal > 0) {
+                var layerInputValDec = parseInt(layerInputVal) - 1;
+                $scope.layerNumber = parseInt(layerInputValDec);
+                $("#txtlayerNumber").val($scope.layerNumber);
+            }
+
+
+        }
         $scope.LayerChange();
 
     }
@@ -7959,6 +7981,31 @@ function ($scope, $rootScope, $compile, $http, $log, $location, $timeout, DA, Mo
             $scope.LayerChange();
         }
 
+        // 'x' button is displaying inside the input box in IE browser.
+        if (e.which == 38) {
+
+
+            var layerInputVal = $("#txtlayerNumber").val();
+            if (layerInputVal != $rootScope.totalLayers) {
+                var layerInputValInc = parseInt(layerInputVal) + 1;
+                $scope.layerNumber = parseInt(layerInputValInc);
+                $("#txtlayerNumber").val($scope.layerNumber);
+            }
+
+
+        }
+
+        // 'x' button is displaying inside the input box in IE browser.
+        if (e.which == 40) {
+            var layerInputVal = $("#txtlayerNumber").val();
+            if (layerInputVal > 0) {
+                var layerInputValDec = parseInt(layerInputVal) - 1;
+                $scope.layerNumber = parseInt(layerInputValDec);
+                $("#txtlayerNumber").val($scope.layerNumber);
+            }
+        }
+
+
     }
 
 
diff --git a/400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html b/400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html
index 60e1096..e309d6a 100644
--- a/400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html
+++ b/400-SOURCECODE/AIAHTML5.Web/app/views/da/da-view.html
@@ -248,9 +248,33 @@
 
         </div>
         <div class="">
-            <p>
+
+
+            <!--'x' button is displaying inside the input box in IE browser.-->
+            <div style="width:80px;margin:10px 0 0 15px;display:inline-block;">
+                <div style="width: 58px; float: left;">
+                    <input type="text" class="form-control item" id="txtlayerNumber" value="0" ng-model="layerNumber" ng-keydown="LayerChangeBasedOnKeyPressed($event)" style="height:32px;border-radius:0;">
+                </div>
+                <div style="width: 22px; float: left;">
+                    <div style="width: 100%; float: left; height: 16px;">
+                        <button type="button" id="incrmntVal" ng-click="LayerChangeOnMouseUpDown($event)" class="btn btn-default" style="padding:0 5px;border-radius:0;font-size: 10px;vertical-align:top;">
+
+                            <img style="width:10px;height:10px;" src="~/../content/images/DA/angle-up.png" />
+                        </button>
+                    </div>
+                    <div style="width: 100%; float: left; height: 16px;">
+                        <button type="button" id="deccrmntVal" ng-click="LayerChangeOnMouseUpDown($event)" class="btn btn-default" style="padding:0 5px;border-radius:0;font-size: 10px;vertical-align:top;">
+                            <img style="width:10px;height:10px;" src="~/../content/images/DA/angle-down.png" />
+                        </button>
+                    </div>
+                </div>
+
+            </div>
+
+            
+            <!--<p>
                 <input class="item" type="number" id="txtlayerNumber" value="0" step="1" min="0" style="width:80px; margin:10px 0 0 15px;" ng-model="layerNumber" ng-keydown="LayerChangeBasedOnKeyPressed($event)" ng-click="LayerChangeOnMouseUpDown($event)" />
-            </p>
+            </p>-->
             <div id="layerChangeSlider" style="height:140px;" class="vert_slider " ng-model="layerNumber"></div>
         </div>
     </div>
@@ -391,6 +415,25 @@
     });</script>
 <script>
     $(function () {
+
+
+        var regExp = /[0-9\.\,]/;
+        $('#txtlayerNumber').on('keydown keyup', function (e) {
+            var value = String.fromCharCode(e.which) || e.key;
+            // Only numbers, dots and commas
+            if (!regExp.test(value)
+              && e.which != 188 // ,
+              && e.which != 190 // .
+              && e.which != 8   // backspace
+              && e.which != 46  // delete
+              && (e.which < 37  // arrow keys
+                || e.which > 40)) {
+                e.preventDefault();
+                return false;
+            }
+        });
+
+
         $("#layerChangeSlider").slider({
             orientation: "vertical",
             range: "max", // <--- needed...
diff --git a/400-SOURCECODE/AIAHTML5.Web/content/images/DA/angle-down.png b/400-SOURCECODE/AIAHTML5.Web/content/images/DA/angle-down.png
new file mode 100644
index 0000000..abe2189
--- /dev/null
+++ b/400-SOURCECODE/AIAHTML5.Web/content/images/DA/angle-down.png
diff --git a/400-SOURCECODE/AIAHTML5.Web/content/images/DA/angle-up.png b/400-SOURCECODE/AIAHTML5.Web/content/images/DA/angle-up.png
new file mode 100644
index 0000000..4ab469f
--- /dev/null
+++ b/400-SOURCECODE/AIAHTML5.Web/content/images/DA/angle-up.png