diff --git a/beat/web/reports/static/reports/app/directives/groupItemContainer.js b/beat/web/reports/static/reports/app/directives/groupItemContainer.js
index e66a4e73ab9ded9e832948bbad5a16c0bbfcc4e5..85af840e69b6ae81747bbdb7d57364cd6975f5a2 100644
--- a/beat/web/reports/static/reports/app/directives/groupItemContainer.js
+++ b/beat/web/reports/static/reports/app/directives/groupItemContainer.js
@@ -35,7 +35,8 @@ angular.module('reportApp')
 		link: function(scope){
 			scope.item = scope.reportItem;
 			scope.domId = `${scope.group.name}_${scope.id}`;
-			scope.showSerialized = { val: true };
+			scope.showSerialized = { val: false };
+			scope.serializeFuncObj = { val: () => 'UNDEFINED' };
 		},
 		template: `
 <div class='row'>
@@ -47,6 +48,7 @@ angular.module('reportApp')
 			group='group'
 			id='item.id'
 			show-serialized='showSerialized'
+			serialize-func-obj='serializeFuncObj'
 			fields='item.content'
 			>
 		</div>
@@ -57,6 +59,7 @@ angular.module('reportApp')
 			group='group'
 			id='item.id'
 			show-serialized='showSerialized'
+			serialize-func-obj='serializeFuncObj'
 			content='item.content'
 			>
 		</div>
@@ -66,6 +69,7 @@ angular.module('reportApp')
 			class='panel panel-default'
 			group='group'
 			show-serialized='showSerialized'
+			serialize-func-obj='serializeFuncObj'
 			report-item='item'
 			>
 		</div>
@@ -74,7 +78,8 @@ angular.module('reportApp')
 		group-view-serialized
 		ng-if='showSerialized.val'
 		class='col-md-6'
-		entity='fields'
+		entity='item'
+		serialize-func-obj='serializeFuncObj'
 		>
 	</div>
 </div>
diff --git a/beat/web/reports/static/reports/app/directives/groupTableItem.js b/beat/web/reports/static/reports/app/directives/groupTableItem.js
index 10853e565542ba390cb6da71c451810429881640..d1eb1d73498e97c534f33535aa09964f236911f6 100644
--- a/beat/web/reports/static/reports/app/directives/groupTableItem.js
+++ b/beat/web/reports/static/reports/app/directives/groupTableItem.js
@@ -32,7 +32,8 @@ angular.module('reportApp')
 			group: '=',
 			id: '=',
 			fields: '=',
-			showSerialized: '='
+			showSerialized: '=',
+			serializeFuncObj: '='
 		},
 		link: function(scope){
 			// add 'expName' to the beginning of the fields to show in the table
@@ -115,6 +116,24 @@ angular.module('reportApp')
 			scope.domId = `${scope.group.name}_${scope.id}`;
 			scope.colSelectorId = `${scope.domId}_columnSelector`;
 
+			scope.serializeFuncObj.val = () => {
+				let fields = scope.fields;
+				let exps = scope.group.experiments
+				// clone arr
+				.map(e => `${e}`)
+				.sort((ea, eb) => (scope.sortField.isReversed ? -1 : 1) * (scope.sortFunc(ea) > scope.sortFunc(eb) ? -1 : 1))
+				;
+
+				let str = '';
+				let fieldsStr = fields.join(',');
+				let expsStrs = exps
+				.map(e => fields.map(f => `${scope.getFieldVal(e, f)}(${scope.getFieldType(f)})`).join(','))
+				.join('\n');
+
+				str = `${fieldsStr}\n${expsStrs}`;
+
+				return str;
+			};
 		},
 		template: `
 <div id="{{domId}}-heading" class="panel-heading" role="tab">
diff --git a/beat/web/reports/static/reports/app/directives/groupTextItem.js b/beat/web/reports/static/reports/app/directives/groupTextItem.js
index bc3656669b5b73f8f095c5c8144ac20b38581536..6bb7ea5eb7b0f916604eff4d7a6073c60d60eb8e 100644
--- a/beat/web/reports/static/reports/app/directives/groupTextItem.js
+++ b/beat/web/reports/static/reports/app/directives/groupTextItem.js
@@ -31,7 +31,8 @@ angular.module('reportApp')
 		scope: {
 			group: '=',
 			reportItem: '=',
-			showSerialized: '='
+			showSerialized: '=',
+			serializeFuncObj: '='
 		},
 		link: function(scope){
 			scope.item = scope.reportItem;
@@ -49,17 +50,14 @@ angular.module('reportApp')
 
 			// the text editor
 			scope.editor;
-			scope.hasUnsavedContent = { val: false, change () { this.val = true; } };
+			scope.txt = { val: '' };
 
 			let setupEditor = (el) => {
 				scope.editor = new Quill(el, editorOptions);
 				if(typeof scope.item.content === 'object'){
 					scope.editor.setContents(scope.item.content);
+					scope.txt.val = scope.editor.getText();
 				}
-				scope.editor.on('text-change', (newDelta) => {
-					scope.hasUnsavedContent.change();
-					console.log(scope.hasUnsavedContent);
-				});
 			};
 
 			let editorId = `${scope.domId}-text-editor`;
@@ -72,11 +70,12 @@ angular.module('reportApp')
 			);
 
 			scope.saveContent = () => {
-				console.log(scope.hasUnsavedContent);
 				let newContent = scope.editor.getContents();
-				scope.hasUnsavedContent.val = false;
 				scope.item.content = newContent;
+				scope.txt.val = scope.editor.getText();
 			};
+
+			scope.serializeFuncObj.val = () => scope.txt;
 		},
 		template: `
 <div id="{{domId}}-heading" class="panel-heading" role="tab">
@@ -103,9 +102,6 @@ angular.module('reportApp')
 		<button class='btn btn-danger' ng-click='group.removeReportItem(item.id)'>
 			Delete Text Block
 		</button
-	<div ng-if='hasUnsavedContent.val === true'>
-		<strong>Warning:</strong> Press the 'Save Content' button to save changes.
-	</div>
 	</h4>
 </div>
 <div id="collapse-{{domId}}"
diff --git a/beat/web/reports/static/reports/app/directives/groupViewSerialized.js b/beat/web/reports/static/reports/app/directives/groupViewSerialized.js
index 6a0dce037de709ac19d7f18cbde9c5943d8bd34c..558a0c2448602c98471c7cd8a7063192ffec2861 100644
--- a/beat/web/reports/static/reports/app/directives/groupViewSerialized.js
+++ b/beat/web/reports/static/reports/app/directives/groupViewSerialized.js
@@ -29,13 +29,16 @@ angular.module('reportApp')
 .directive("groupViewSerialized", [function(){
 	return {
 		scope: {
-			entity: '='
+			entity: '=',
+			serializeFuncObj: '='
 		},
 		link: function(scope, el){
 		},
 		template: `
 <div class='well'>
-{{ entity }}
+<pre>
+{{ serializeFuncObj.val() }}
+</pre>
 </div>
 `
 	};