diff --git a/ayanova/src/components/custom-fields-control.vue b/ayanova/src/components/custom-fields-control.vue
index b9f98cc8..38fe4b95 100644
--- a/ayanova/src/components/custom-fields-control.vue
+++ b/ayanova/src/components/custom-fields-control.vue
@@ -1,5 +1,5 @@
 <template>
-  <div v-if="this.$store.state.formCustomTemplate[formKey]">
+  <div v-if="templateHasVisibleCustomFields()">
     <span class="v-label v-label--active theme--light">
       {{ lt("ObjectCustomFieldCustomGrid") }}
     </span>
@@ -139,44 +139,7 @@
 /////////////////////////////////////////////////////////////////////////////////////////////////////////////
 /*  XXXeslint-disable    */
 ////////////////////////////////////////////////////////////////////////////////////////////////////////////
-/**
- * v-if="item.hide == false"
- *
- * some discussion here might be useful: https://github.com/vuejs/vue/issues/1056
- * 
- * TODO: have the template, have the custom field data, now just need to show it all properly and update the fragment of json when changes made which then updates the
- * parent object.
- *
- * 1) read the template, extract out only the Custom fields, use pattern XXXXCustomXXX to match?  Nope, if it has a "type" then it's custom for sure.
- * 
- * 2) Generate the controls dynamically based on the template
- * Possible types are:
- * 
-        public const string Currency = "currency";
-        public const string Date = "date";
-        public const string Time = "time";
-        public const string DateTime = "datetime";
-        public const string Text = "text";
-        public const string Number = "number"; //decimal regardless
-        public const string Bool = "bool";
 
-   {
-  "data": {
-    "id": 1,
-    "concurrencyToken": 3794970,
-    "formKey": "widget",
-    "template": "[{\"fld\":\"WidgetNotes\",\"required\":true},{\"fld\":\"WidgetCustom1\",\"required\":false,\"type\":\"datetime\"},{\"fld\":\"WidgetCustom2\",\"required\":true,\"type\":\"text\"},{\"fld\":\"WidgetCustom3\",\"required\":false,\"type\":\"number\"},{\"fld\":\"WidgetCustom4\",\"required\":false,\"type\":\"bool\"},{\"fld\":\"WidgetCustom5\",\"required\":false,\"type\":\"currency\"},{\"fld\":\"WidgetCustom6\",\"required\":false,\"type\":\"date\"},{\"fld\":\"WidgetCustom7\",\"required\":false,\"type\":\"time\"}]"
-  }
-}
-CUSTOM FIELD DATA:
-{"c1":"2020-03-12T16:37:39.9094856Z","c2":"Sint laborum quisquam dolorem ipsum architecto voluptate consequatur tempora praesentium. Nemo aliquam amet aut aliquid perspiciatis adipisci excepturi. Officia ea voluptatem dolore suscipit ipsa itaque. Quaerat nostrum ut qui dignissimos nesciunt quasi laudantium dicta. Ut nihil doloribus illum rem quas sed.","c3":30453626,"c4":false,"c5":0.529134196010015}
-
-
- * 3) bind to the data somehow (might have to warp the data to fit the controls in some cases due to changed template design)
-    - computed properties that sit above the json and translate into and out of it, custom1, custom2 etc.  If empty then it's just empty.
- * 4) Profit$
- * 
- */
 export default {
   data() {
     return {};
@@ -211,6 +174,14 @@ export default {
         window.$gz.form.onChange(this.parentVM, ref);
       }
     },
+    templateHasVisibleCustomFields() {
+      var template = this.$store.state.formCustomTemplate[this.formKey];
+      if (template == undefined) {
+        return false;
+      }
+      //iterate template and see if it has any custom fields set to display
+      return window.$gz._.find(template, "type") != undefined;
+    },
     GetValueForField: function(dataKey) {
       if (!this.value) {
         return null;