diff --git a/ayanova/src/api/form-custom-template.js b/ayanova/src/api/form-custom-template.js
index af9fd786..172a03ce 100644
--- a/ayanova/src/api/form-custom-template.js
+++ b/ayanova/src/api/form-custom-template.js
@@ -1,26 +1,23 @@
-/*eslint-disable */
+/*e slint-disable */
 import store from "../store";
 import gzapi from "./gzapi";
 import _ from "../libs/lodash.min.js";
 
-
+///Add data key names which make the custom fields control work more easily
+///Since the names can be inferred from the data that comes from the server it saves bandwidth to do it here at the client
 function addDataKeyNames(obj) {
-  //debugger;
   //iterate the array of objects
   //if it has a "type" property then it's a custom field so add its data key name
 
-  
   for (var i = 0; i < obj.length; i++) {
-    if(obj[i].type){
-      obj[i]["dataKey"]="c"+parseInt(obj[i].fld.replace( /^\D+/g, ''))
+    if (obj[i].type) {
+      obj[i]["dataKey"] = "c" + parseInt(obj[i].fld.replace(/^\D+/g, ""));
     }
   }
-
   //return the whole thing again now translated
   return obj;
 }
 
-
 export default {
   get(formKey) {
     return new Promise(function getFormTemplate(resolve) {
diff --git a/ayanova/src/components/custom-fields-control.vue b/ayanova/src/components/custom-fields-control.vue
index b898740e..52f500cc 100644
--- a/ayanova/src/components/custom-fields-control.vue
+++ b/ayanova/src/components/custom-fields-control.vue
@@ -12,7 +12,7 @@
       </span>
     </div>
     <hr />
-    {{ obj.c2 }}
+   
     <div>
       <v-layout align-center justify-left row wrap>
         <template v-for="item in this.$store.state.formCustomTemplate[formKey]">
@@ -31,7 +31,7 @@
             </div>
             <div v-else-if="item.type === 'text'">
               <v-textarea
-                v-model="$data[item.fld]"
+                v-model="$data[item.dataKey]"
                 :readonly="readOnly"
                 :label="lt(item.fld)"
                 auto-grow
@@ -94,8 +94,21 @@ CUSTOM FIELD DATA:
 export default {
   data() {
     return {
-      obj: { me: 1, c2: "This is my c2 data!",  WidgetCustom2: "Here is my OBJ.WidgetCustom2 Data!" },
-      WidgetCustom2: "Here is my WidgetCustom2 Data!"
+      c1:null,
+      c2: "Here is my WidgetCustom2 Data!",
+      c3: null,
+      c4: null,
+      c5: null,
+      c6: null,
+      c7: null,
+      c8: null,
+      c9: null,
+      c10: null,
+      c12: null,
+      c13: null,
+      c14: null,
+      c15: null,
+      c16: null
     };
   },
   props: {