A Trick: Viewing Field IDs on A Form


When you program integration or configure a printout template, you need quick access to the list of field IDs. You don’t always remember them and you aren’t always the original author. It is also inconvenient to keep entering and leaving FormBuilder.

Here’s a trick to help you and display field codes at the level of a published form.

First, paste the following code in the JavaScript file in the form layout:

function showAFMeta(){var d=epoint.eforms.DependenciesEngine;var c=epoint.eforms.CustomElement;var f=d.formNode;var _1=d.getElements(function(_2){return d.isField(_2)||d.isCustomComponent(_2);},d.formActivePage);for(var i=0,el;el=_1[i];i++){var _3;var _4=el.code;var ch;if(d.isCustomField(el)||d.isCustomComponent(el)){_3=c.getElement(el).iframe;if(d.isCustomComponent(el)){_4="";var ch=d.getElementChildren(el);var _5=[];for(var ii=0;ii<ch.length;ii++){_5.push(ch[ii].code);}_4=_5.join(", ");}}else{var _6=el.name;if(d.isComboboxesDateField(el)){_6+="_year";}if(d.isMultifield(el)){ch=d.getElementChildren(el);if(!ch[ch.length-1]){continue;}if(d.isComboboxesDateField(ch[ch.length-1])){_6=ch[ch.length-1].name+"_year";}else{_6=ch[ch.length-1].name;}}_3=f.elements[_6];if(d.isSeparateOptionsField(el)){_3=_3[0];}}if(_3&&_3.parentNode){var _7=document.createElement("span"); _7.innerHTML=_4;_7.style.position="absolute";_7.style.border="1px solid red";_7.style.background="white";_7.style.font="normal normal normal 11px monospace";_3.parentNode.insertBefore(_7,_3.nextSibling);}}};

Second, publish the form, and when it is invoked, type the following in the browser address bar:


There are red boxes with field codes next to each form field.

recent posts
3rd Apr 2014
Faster than ever!
5th Dec 2013
Live validation!
2nd Dec 2013
Features distilled
12th Mar 2012
Flicking Channels
26th Jan 2012
Your Own Error Page
9th May 2011
Box Properties
15th Apr 2011
Grouping Fields
13th Apr 2011
Form Versioning
24th Feb 2011
Form Access Modes
22nd Feb 2011
Required Fields
4th Feb 2011