diff --git a/web/gui/src/main/java/org/onosproject/ui/impl/FlowViewMessageHandler.java b/web/gui/src/main/java/org/onosproject/ui/impl/FlowViewMessageHandler.java
index ac4aeb2..18c3637 100644
--- a/web/gui/src/main/java/org/onosproject/ui/impl/FlowViewMessageHandler.java
+++ b/web/gui/src/main/java/org/onosproject/ui/impl/FlowViewMessageHandler.java
@@ -223,6 +223,40 @@
             return OX + flow.id();
         }
 
+        private String decorateGroupId(FlowRule flow) {
+            return OX + flow.groupId().id();
+        }
+
+        private String getCriteriaString(FlowRule flow) {
+            Set<Criterion> criteria = flow.selector().criteria();
+            StringBuilder sb = new StringBuilder();
+            for (Criterion c : criteria) {
+                sb.append(c).append(COMMA);
+            }
+            int pos = sb.lastIndexOf(COMMA);
+            sb.delete(pos, sb.length());
+
+            return sb.toString();
+        }
+
+        private String getTreatmentString(FlowRule flow) {
+            List<Instruction> instructions = flow.treatment().allInstructions();
+            StringBuilder sb = new StringBuilder();
+            for (Instruction inst : instructions) {
+                sb.append(inst).append(COMMA);
+            }
+            if (flow.treatment().metered() != null) {
+                sb.append(flow.treatment().metered().toString()).append(COMMA);
+            }
+            if (flow.treatment().tableTransition() != null) {
+                sb.append(flow.treatment().tableTransition().toString()).append(COMMA);
+            }
+            int pos = sb.lastIndexOf(COMMA);
+            sb.delete(pos, sb.length());
+
+            return sb.toString();
+        }
+
         @Override
         public void process(long sid, ObjectNode payload) {
 
@@ -232,8 +266,17 @@
             if (flow != null) {
                 ObjectNode data = objectNode();
 
+
                 data.put(FLOW_ID, decorateFlowId(flow));
                 data.put(FLOW_PRIORITY, flow.priority());
+                data.put(GROUP_ID, decorateGroupId(flow));
+                data.put(APP_ID, flow.appId());
+                data.put(TABLE_ID, flow.tableId());
+                data.put(TIMEOUT, flow.hardTimeout());
+                data.put(PERMANENT, Boolean.toString(flow.isPermanent()));
+                data.put(SELECTOR, getCriteriaString(flow));
+                data.put(TREATMENT, getTreatmentString(flow));
+
 
                 //TODO put more detail info to data
 
diff --git a/web/gui/src/main/webapp/app/view/flow/flow.js b/web/gui/src/main/webapp/app/view/flow/flow.js
index 6f862fb..c0f0346 100644
--- a/web/gui/src/main/webapp/app/view/flow/flow.js
+++ b/web/gui/src/main/webapp/app/view/flow/flow.js
@@ -30,6 +30,10 @@
         pHeight,
         top,
         topTable,
+        trmtDiv,
+        selDiv,
+        topSelTable,
+        topTrmtTable,
         bottom,
         iconDiv,
         nameDiv,
@@ -49,10 +53,12 @@
         detailsResp = 'flowDetailsResponse',
 
         propOrder = [
-            'flowId', 'priority'
+            'flowId', 'priority', 'groupId', 'appId', 'tableId',
+            'timeout', 'permanent'
         ],
         friendlyProps = [
-            'Flow ID', 'Flow Priority'
+            'Flow ID', 'Flow Priority', 'Group ID', 'Application ID',
+            'Table ID', 'Timeout', 'Permanent'
         ];
 
     function closePanel() {
@@ -78,8 +84,9 @@
         detailsPanel.empty();
 
         container = detailsPanel.append('div').classed('container', true);
-
         top = container.append('div').classed('top', true);
+        trmtDiv = container.append('div').classed('top', true);
+        selDiv = container.append('div').classed('top', true);
         closeBtn = top.append('div').classed('close-btn', true);
         addCloseBtn(closeBtn);
         iconDiv = top.append('div').classed('dev-icon', true);
@@ -87,6 +94,14 @@
         topTable = top.append('div').classed('top-content', true)
             .append('table');
         top.append('hr');
+        trmtDiv.append('h2').html('Treatment');
+        topTrmtTable = trmtDiv.append('div').classed('top-content', true)
+            .append('table');
+        trmtDiv.append('hr');
+        selDiv.append('h2').html('Selector');
+        topSelTable = selDiv.append('div').classed('top-content', true)
+            .append('table');
+
 
         //ToDo add more details
     }
@@ -101,15 +116,44 @@
         addCell('value', value);
     }
 
+    function populateTable(tbody, label, value) {
+        var tr = tbody.append('tr');
+
+        function addCell(cls, txt) {
+            tr.append('td').attr('class', cls).html(txt);
+        }
+        addCell('label', label + ' :');
+        addCell('value', value);
+    }
+
     function populateTop(details) {
         is.loadEmbeddedIcon(iconDiv, 'flowTable', 40);
         top.select('h2').html(details.flowId);
 
         var tbody = topTable.append('tbody');
 
+        var topSelTablebody = topSelTable.append('tbody');
+        var selectorString = details['selector'];
+        var selectors = selectorString.split(',');
+
+        var topTrmtTablebody = topTrmtTable.append('tbody');
+        var treatmentString = details['treatment'];
+        var treatment = treatmentString.split(',');
+
         propOrder.forEach(function (prop, i) {
             addProp(tbody, i, details[prop]);
         });
+
+        selectors.forEach(function (sel) {
+            var selArray = sel.split(':');
+            populateTable(topSelTablebody, selArray[0], selArray[1]);
+        });
+
+        treatment.forEach(function (sel) {
+            var selArray = sel.split(':');
+            populateTable(topTrmtTable, selArray[0], selArray[1]);
+        });
+
     }
 
     function createDetailsPane() {