diff --git a/web/gui/src/main/java/org/onosproject/ui/impl/ClusterViewMessageHandler.java b/web/gui/src/main/java/org/onosproject/ui/impl/ClusterViewMessageHandler.java
index ff94ff2..a84d38a 100644
--- a/web/gui/src/main/java/org/onosproject/ui/impl/ClusterViewMessageHandler.java
+++ b/web/gui/src/main/java/org/onosproject/ui/impl/ClusterViewMessageHandler.java
@@ -40,8 +40,8 @@
     private static final String CLUSTER_DATA_RESP = "clusterDataResponse";
     private static final String CLUSTERS = "clusters";
 
-    private static final String CLUSTER_DETAILS_REQ = "clusterNodeDetailsRequest";
-    private static final String CLUSTER_DETAILS_RESP = "clusterNodeDetailsResponse";
+    private static final String CLUSTER_DETAILS_REQ = "clusterDetailsRequest";
+    private static final String CLUSTER_DETAILS_RESP = "clusterDetailsResponse";
     private static final String DETAILS = "details";
 
     private static final String ID = "id";
diff --git a/web/gui/src/main/webapp/app/view/cluster/cluster.css b/web/gui/src/main/webapp/app/view/cluster/cluster.css
index 2ed0f63..13668e8 100644
--- a/web/gui/src/main/webapp/app/view/cluster/cluster.css
+++ b/web/gui/src/main/webapp/app/view/cluster/cluster.css
@@ -29,29 +29,29 @@
 
 /* More in generic panel.css */
 
-#node-details-panel.floatpanel {
+#cluster-details-panel.floatpanel {
     z-index: 0;
 }
 
 
-#node-details-panel .container {
+#cluster-details-panel .container {
     padding: 8px 12px;
 }
 
-#node-details-panel .close-btn {
+#cluster-details-panel .close-btn {
     position: absolute;
     right: 12px;
     top: 12px;
     cursor: pointer;
 }
 
-#node-details-panel .dev-icon {
+#cluster-details-panel .dev-icon {
     display: inline-block;
     padding: 0 6px 0 0;
     vertical-align: middle;
 }
 
-#flow-details-panel h2 {
+#cluster-details-panel h2 {
     display: inline-block;
     margin: 8px 0;
 }
diff --git a/web/gui/src/main/webapp/app/view/cluster/cluster.html b/web/gui/src/main/webapp/app/view/cluster/cluster.html
index 3b4481d..dab3805 100644
--- a/web/gui/src/main/webapp/app/view/cluster/cluster.html
+++ b/web/gui/src/main/webapp/app/view/cluster/cluster.html
@@ -53,5 +53,5 @@
         </div>
 
     </div>
-    <node-details-panel></node-details-panel>
+    <cluster-details-panel></cluster-details-panel>
 </div>
diff --git a/web/gui/src/main/webapp/app/view/cluster/cluster.js b/web/gui/src/main/webapp/app/view/cluster/cluster.js
index 270ed59..c849c48 100644
--- a/web/gui/src/main/webapp/app/view/cluster/cluster.js
+++ b/web/gui/src/main/webapp/app/view/cluster/cluster.js
@@ -44,9 +44,9 @@
             htPdg = 479,
             wtPdg = 532,
 
-            pName = 'node-details-panel',
-            detailsReq = 'nodeDetailsRequest',
-            detailsResp = 'nodeDetailsResponse';
+            pName = 'cluster-details-panel',
+            detailsReq = 'clusterDetailsRequest',
+            detailsResp = 'clusterDetailsResponse';
 
         function closePanel() {
             if (detailsPanel.isVisible()) {
@@ -110,14 +110,14 @@
             detailsPanel.width(wtPdg);
 
             //Todo : remove this when server implementation is done
-            detailsPanel.show();
+            // detailsPanel.show();
         }
 
         function respDetailsCb(data) {
             $scope.panelData = data.details;
             $scope.$apply();
             //TODO Use populateDetails() when merging server code
-            $log.debug('Get the details:', $scope.panelData.id);
+            $log.debug('Get the details:', $scope.panelData);
         }
 
 
@@ -158,7 +158,7 @@
                     wss.sendEvent(detailsReq, {id: row.id});
 
                     //ToDo : Remove this line when server implmentation is complete
-                    populateDetails($scope.selId);
+                    // populateDetails($scope.selId);
                 } else {
                     $scope.hidePanel();
                 }
@@ -173,7 +173,7 @@
             }])
 
 
-    .directive('nodeDetailsPanel',
+    .directive('clusterDetailsPanel',
     ['$rootScope', '$window', '$timeout', 'KeyService',
     function ($rootScope, $window, $timeout, ks) {
         return function (scope) {
@@ -199,6 +199,14 @@
                 initPanel();
             }
 
+            // if the panelData changes
+            scope.$watch('panelData', function () {
+                if (!fs.isEmptyObject(scope.panelData)) {
+                    populateDetails(scope.panelData);
+                    detailsPanel.show();
+                }
+            });
+
             // if the window size changes
             unbindWatch = $rootScope.$watchCollection(
                 function () {