diff --git a/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.html b/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.html
index 366c80fcc13..df6e4e8797f 100644
--- a/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.html
+++ b/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.html
@@ -23,6 +23,11 @@
 <link rel="stylesheet" type="text/css" href="/static/dataTables.bootstrap.css" />
 <link rel="stylesheet" type="text/css" href="/static/hadoop.css" />
 <title>Namenode information</title>
+<style>
+.col-sm-6 {
+    width: 30%;
+}
+</style>
 </head>
 <body>
 
@@ -315,9 +320,11 @@
 <small><div id="datanode-usage-histogram"></div></small>
 <div class="page-header"><h1><small>In operation</small></h1></div>
 <small>
+<p id="datanodefilter" class="col-sm-6">DataNode State </p>
 <table class="table" id="table-datanodes">
   <thead>
     <tr>
+      <th>State</th>
       <th>Node</th>
       <th>Http Address</th>
       <th>Last contact</th>
@@ -330,6 +337,7 @@
   </thead>
   {#LiveNodes}
   <tr>
+    <td ng-value="{state}">{state}</td>
     <td ng-value="{state}-{name}" class="dfshealth-node-icon dfshealth-node-{state}">{name} ({xferaddr})</td>
     <td ng-value="{state}-{name}"><a href='{dnWebAddress}'>{dnWebAddress}</a></td>
     <td ng-value="{lastContact}">{lastContact}s</td>
@@ -350,6 +358,7 @@
   {/LiveNodes}
   {#DeadNodes}
   <tr class="danger">
+    <td ng-value="{state}">{state}</td>
     <td ng-value="{state}-{name}" class="dfshealth-node-icon dfshealth-node-{state}">{name} ({xferaddr})</td>
     <td></td>
     <td>{#helper_relative_time value="{lastContact}"/}</td>
@@ -357,6 +366,7 @@
     <td></td>
     <td></td>
     <td></td>
+    <td></td>
   </tr>
   {/DeadNodes}
 </table>
diff --git a/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.js b/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.js
index 4e8b362d9ae..d12a9fbb203 100644
--- a/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.js
+++ b/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/hdfs/dfshealth.js
@@ -333,7 +333,11 @@
           $('#tab-datanode').html(out);
           $('#table-datanodes').dataTable( {
             'lengthMenu': [ [25, 50, 100, -1], [25, 50, 100, "All"] ],
+            'columnDefs': [
+              { 'targets': [ 0 ], 'visible': false, 'searchable': false }
+             ],
             'columns': [
+              { 'orderDataType': 'ng-value', 'searchable': true , "defaultContent": "" },
               { 'orderDataType': 'ng-value', 'searchable': true , "defaultContent": "" },
               { 'orderDataType': 'ng-value', 'searchable': true , "defaultContent": ""},
               { 'orderDataType': 'ng-value', 'type': 'num' , "defaultContent": 0},
@@ -342,7 +346,22 @@
               { 'type': 'num' , "defaultContent": 0},
               { 'orderDataType': 'ng-value', 'type': 'num' , "defaultContent": 0},
               { 'type': 'string' , "defaultContent": ""}
-            ]});
+              ],
+              initComplete: function () {
+                var column = this.api().column([0]);
+                var select = $('<select class="datanodestatus form-control input-sm"><option value="">All</option></select>')
+                              .appendTo('#datanodefilter')
+                              .on('change', function () {
+                                var val = $.fn.dataTable.util.escapeRegex(
+                                $(this).val());
+                                column.search(val ? '^' + val + '$' : '', true, false).draw();
+                              });
+                console.log(select);
+                column.data().unique().sort().each(function (d, j) {
+                  select.append('<option value="' + d + '">' + d + '</option>');
+                });
+            }
+          });
           renderHistogram(data);
           $('#ui-tabs a[href="#tab-datanode"]').tab('show');
         });
@@ -469,4 +488,4 @@ function open_hostip_list(x0, x1) {
 function close_hostip_list() {
   $("#datanode_ips").remove();
   $("#close_ips").remove();
-}
\ No newline at end of file
+}
diff --git a/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/static/hadoop.css b/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/static/hadoop.css
index b3e79e2d507..e7a264c7453 100644
--- a/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/static/hadoop.css
+++ b/hadoop-hdfs-project/hadoop-hdfs/src/main/webapps/static/hadoop.css
@@ -314,6 +314,13 @@ header.bs-docs-nav, header.bs-docs-nav .navbar-brand {
   left: 75px;
 }
 
+.datanodestatus{
+    width:75px;
+    height:30px;
+    color: #555;
+    display: inline-block;
+}
+
 .bar rect {
     fill: #5FA33F;
 }

State	Node	Http Address	Last contact
{state}	{name} ({xferaddr})	{dnWebAddress}	{lastContact}s
{state}	{name} ({xferaddr})		{#helper_relative_time value="{lastContact}"/}