DataEditor Xml

The DataEditor Xml defines the UI: which fields should be presented to the user, optionally using multiple tabs like Edit Item does, to group fields on several tabs.

For each field, a control can be specified and some meta properties can be set to ensure data integrity (is the field required e.g.).

Besides defining the UI, the DataEditor Xml can also contain advanced (XForms) model logic to e.g. validate and/or enforce constraints on specific fields.

An example for the FileTypes table is shown below.

XML

Copy Code

<dataeditor xmlns:xf="http://www.w3.org/2002/xforms" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns="http://smartsite.nl/namespaces/dataeditor/2.0">   <layout title="">     <tabs>       <tab title="">         <field name="name" caption="Name">           <control type="textbox">             <properties>               <property name="required">true</property>               <property name="alert">Naam is verplicht</property>               <property name="maxlength">50</property>             </properties>           </control>         </field>         <field name="code" caption="Code">           <control type="textbox">             <properties>               <property name="required">true</property>               <property name="alert">Code is veplicht</property>               <property name="maxlength">20</property>             </properties>           </control>         </field>         <field name="fileextension" caption="Extensie">           <control type="textbox">             <properties>               <property name="required">true</property>               <property name="alert">Extensie is verplicht</property>               <property name="maxlength">10</property>             </properties>           </control>         </field>         <field name="nrmimetype" caption="MimeType">           <control type="dropdownlist">             <properties>               <property name="required">true</property>               <property name="alert">U moet een mimetype selecteren</property>             </properties>             <itemset ref="is_mimetypes" />           </control>         </field>       </tab>     </tabs>     <modellogic>       <xf:bind nodeset="cms:entry/cms:code" required="true()"                calculate="fn:upper-case(fn:replace(.,'[^A-Za-z0-9\-\._]',''))" readonly="false()"                type="dataeditor:genericCodeType" />     </modellogic>   </layout>   <itemsets>     <load tablename="mimetypes" />   </itemsets> </dataeditor>

layout

The layout element is the root element which defines (more or less) the UI.

tabs

The tabs element is just a container element, which should at least contain one tab element.
When you want to group the fields on more than one tab, specify multiple tab elements, each containing a set of fields.

tab

For each tab, specify the field elements which should be presented on that tab.

field

The field element defines the UI for a single field. The name attribute should correspond with a field within the metatype. The caption attribute is used to specify the label for the UI element.

control

The control element is used to determine the control type which should be used for the field, e.g. textbox, textarea or dropdownlist. The control type is set using the type attribute.
Control properties can be set using one or more property elements within a properties container element.

To support even more advanced scenario's, you can set the control type to custom, and include your own XForms logic to render the control (see the example below).

<control type="custom">
 <viewdata>
  <xf:input ref="cms:path" id="cf_path" maxlength="250" navindex="1" appearance="full">
   <xf:label>{text:PATH}</xf:label>
   <xf:alert>
    <xf:output ref="instance('res')/name_required" />
    <xf:output ref="instance('res')/name_duplicate" />
   </xf:alert>
  </xf:input>
  <div class="linkinput_buttons">
   <xf:trigger id="linkinput_path" class="btn icon_sys22 icon-sys22-file_explorer xforms-cc">
    <xf:label>{text:LINKINPUT_SELECT_FILE}</xf:label>
    <xf:action ev:event="DOMActivate">
     <xf:message level="sms:startaction">
      { field: "path", action: "linkinput_selectfile" }
     </xf:message>
    </xf:action>
   </xf:trigger>
  </div>
 </viewdata>
 <properties>
  <property name="treemode">SelectFolder</property>
 </properties>
</control>

itemsets

The itemsets element should be used to specify itemset(s) which are used within e.g. dropdown controls.

Usually, when you have a lookup relation, the lookup data is defined in another table and you want this data to be presented to the user as a dropdown control, as is the case in the above example for the nrmimetype field.

Within the control definition, specify a reference to an itemset using the itemset element with a ref attribute which equals the tablename prefixed with "is_".
The itemset itself should be added to the itemsets element using a load element (see below).

load

The load element specifies for which table an itemset should be loaded.
When you have a basic lookup table with the columns Nr (which must be the primary key) and Name, just specify the tablename using the tablename attribute.

Otherwise, when you have a different set of columns and/or you need to specify a where clause, instead of the tablename attribute, use the sql attribute to specify the appropriate sql query and the itemsetname attribute to specify the itemset's name (which should equal tablename prefixed with "is_").

XML	Copy Code
<load tablename="mimetypes" /> <load itemsetname="is_applications" sql="select code, name from Applications" />