Usages

• Extend types of fields available in Form Builder.

  ขยายประเภทของเขตข้อมูลที่มีอยู่ในเครื่องมือสร้างแบบฟอร์ม

• A useable Form Field Element plugin must extends org.joget.apps.form.model.Element abstract class and implements org.joget.apps.form.model.FormBuilderPaletteElement interface.

  ปลั๊กอินองค์ประกอบของเขตข้อมูลฟอร์มที่ใช้งานได้จะต้องขยายคลาสนามธรรม org.joget.apps.form.model.Element และดำเนินการ org.joget.apps.form.model.FormBuilderPaletteElement

Abstract Class

org.joget.apps.form.model.Element

• Under wflow-core module

  ภายใต้โมดูล wflow-core

• Extended org.joget.plugin.base.ExtDefaultPlugin. Please refer to Plugin Base Abstract Class and Interface.

  ขยาย org.joget.plugin.base.ExtDefaultPlugin โปรดอ้างอิงถึงระดับฐานปลั๊กอินและอินเตอร์เฟส

• Implemented org.joget.plugin.property.model.PropertyEditable. Please refer to Plugin Base Abstract Class and Interface.

  ดำเนินการ org.joget.plugin.property.model.PropertyEditable โปรดอ้างอิงถึง Plugin Base Abstract Class and Interface

• A base abstract class to develop a Form Field Element plugin. 

  คลาสนามธรรมพื้นฐานเพื่อพัฒนาปลั๊กอินองค์ประกอบเขตข้อมูลฟอร์ม

• All forms, containers and form fields must extend this class.

  ฟอร์มคอนเทนเนอร์และฟิลด์ฟอร์มทั้งหมดต้องขยายคลาสนี้

Method Detail

Abstract Methods

renderTemplate

public abstract java.lang.String renderTemplate(org.joget.apps.form.model.FormData formData, java.util.Map dataModel)

HTML template for front-end UI.

Parameters:

• dataModel - Model containing values to be displayed in the template.

  เทมเพลต HTML สำหรับ UI ส่วนหน้า พารามิเตอร์: dataModel - โมเดลที่มีค่าที่จะแสดงในเทมเพลต

   

Overridable Methods

formatData

public org.joget.apps.form.model.FormRowSet formatData(org.joget.apps.form.model.FormData formData)

Method that retrieves loaded or submitted form data, and formats it for a store binder. The formatted data is to be stored and returned in a FormRowSet.

formatDataForValidation

public org.joget.apps.form.model.FormData formatDataForValidation(org.joget.apps.form.model.FormData formData)

Method for override to perform format data in request parameter before execute validation

selfValidate

public java.lang.Boolean selfValidate(org.joget.apps.form.model.FormData formData)

Method for override to perform specify validation for this field.

Error message can display with following code:

String id = FormUtil.getElementParameterName(this);

formData.addFormError(id, "Error!!");

render

public java.lang.String render(org.joget.apps.form.model.FormData formData, java.lang.Boolean includeMetaData)

Render HTML template for UI, with option for form builder design mode. This method will call abstract method renderTemplate for rendering.

Parameters:

• includeMetaData - set true to render additional meta required for the Form Builder.

  เทมเพลต HTML แสดงผลสำหรับ UI พร้อมตัวเลือกสำหรับโหมดออกแบบตัวสร้างฟอร์ม วิธีนี้จะเรียกวิธีนามธรรม renderTemplate สำหรับการแสดงผล พารามิเตอร์: includeMetaData - ตั้งค่าเป็นจริงเพื่อแสดงเมตาเพิ่มเติมที่จำเป็นสำหรับตัวสร้างแบบฟอร์ม

renderErrorTemplate

public java.lang.String renderErrorTemplate(org.joget.apps.form.model.FormData formData, java.util.Map dataModel)

HTML template with errors for front-end UI. This method will call abstract method renderTemplate for rendering.

Parameters:

• dataModel - Model containing values to be displayed in the template.

  เทมเพลต HTML ที่มีข้อผิดพลาดสำหรับ UI ส่วนหน้า วิธีนี้จะเรียกวิธีนามธรรม renderTemplate สำหรับการแสดงผล พารามิเตอร์: dataModel - โมเดลที่มีค่าที่จะแสดงในเทมเพลต

renderReadOnlyTemplate

public java.lang.String renderReadOnlyTemplate(org.joget.apps.form.model.FormData formData, java.util.Map dataModel)

Read-only HTML template for front-end UI (Not used at the moment)

Parameters:

• dataModel - Model containing values to be displayed in the template.

  เทมเพลต HTML แบบอ่านอย่างเดียวสำหรับ UI ของส่วนหน้า (ไม่ได้ใช้ในขณะนี้) พารามิเตอร์: dataModel - โมเดลที่มีค่าที่จะแสดงในเทมเพลต

continueValidation

public boolean continueValidation(org.joget.apps.form.model.FormData formData)

Flag to indicate whether or not continue validating descendent elements.

getDynamicFieldNames

public Collection<java.lang.String> getDynamicFieldNames()

Used to create multiple form data column in database by returning extra column names.

hasError

public java.lang.Boolean hasError(org.joget.apps.form.model.FormData formData)

Flag to indicate whether or not this field has fail the validation process

ตั้งค่าสถานะเพื่อระบุว่าฟิลด์นี้ล้มเหลวในกระบวนการตรวจสอบหรือไม่

isAuthorize

public java.lang.Boolean isAuthorize(org.joget.apps.form.model.FormData formData)

Flag to indicate whether or not the current logged in user is authorized to view this field in the form.

It used property key "permission" to retrieve Form Permission plugin.

Utility Methods

getChildren

public java.util.Collection<org.joget.apps.form.model.Element> getChildren()

Retrieves all children form field element under this field

getChildren

public void setChildren(java.util.Collection<org.joget.apps.form.model.Element> children)

Retrieves all children form field element under this field

setChildren

public void setChildren(java.util.Collection<org.joget.apps.form.model.Element> children)

Sets form fields as children of this field

getParent

public org.joget.apps.form.model.Element getParent() 

Returns the immediate parent for this element.

setParent

public void setParent(org.joget.apps.form.model.Element parent)

Sets the immediate parent for this element.

getPrimaryKeyValue

public java.lang.String getPrimaryKeyValue(org.joget.apps.form.model.FormData formData)

Returns the primary key value for the current element. Defaults to the primary key value of the form.

getLoadBinder

public org.joget.apps.form.model.FormLoadBinder getLoadBinder()

Get load binder

setLoadBinder

public void setLoadBinder(org.joget.apps.form.model.FormLoadBinder loadBinder)

Set load binder

getOptionsBinder

public org.joget.apps.form.model.FormLoadBinder getOptionsBinder()

Gets an Options Binder

setOptionsBinder

public void setOptionsBinder(org.joget.apps.form.model.FormLoadBinder optionsBinder)

Sets an Options Binder

getStoreBinder

public org.joget.apps.form.model.FormStoreBinder getStoreBinder()

Gets a Store Binder

setStoreBinder

public void setStoreBinder(org.joget.apps.form.model.FormStoreBinder storeBinder)

Sets a Store Binder

getValidator

public org.joget.apps.form.model.Validator getValidator()

Gets a validator

setValidator

public void setValidator(org.joget.apps.form.model.Validator validator)

Sets a validator

getCustomParameterName

public java.lang.String getCustomParameterName()

If non-null, this is to be used as the HTML input name for the element.

setCustomParameterName

public void setCustomParameterName(java.lang.String customParameterName)

Sets a custom parameter name for the HTML input name of the element.

getDefaultPropertyValues

public java.lang.String getDefaultPropertyValues()

Set default Plugin Properties Options value to a new added Field in Form Builder.

org.joget.apps.form.model.AbstractSubForm

• Under wflow-core module

  ภายใต้โมดูล wflow-core

• Extended org.joget.apps.form.model.Element.

  ขยาย org.joget.apps.form.model.Element

• Implemented org.joget.apps.form.model.FormContainer.

  ดำเนินการ org.joget.apps.form.model.FormContainer

• Use to develop a Form Field element which embed a Form as its child.

  ใช้เพื่อพัฒนาองค์ประกอบของเขตข้อมูลฟอร์มซึ่งฝังฟอร์มเป็นลูกของมัน

Field Detail

Constants 

PROPERTY_PARENT_SUBFORM_ID

public static final String PROPERTY_PARENT_SUBFORM_ID = "parentSubFormId";

Property key that use to retrieve the field id in parent form used to store subform primary key as reference key. 

PROPERTY_SUBFORM_PARENT_ID

public static final String PROPERTY_SUBFORM_PARENT_ID = "subFormParentId";

Property key that use to retrieve the field id in subform used to store parent form primary key as foreign key.

Method Detail

Overridable Methods

loadSubForm

protected org.joget.apps.form.model.Form loadSubForm(org.joget.apps.form.model.FormData parentFormData) throws org.springframework.beans.BeansException

Retrieve a Form object as subform. This method will use either value from property key "formDefId" or "json" to construct the Form object.

updateElementParameterNames

protected void updateElementParameterNames(org.joget.apps.form.model.Element element, java.lang.String prefix)

Update all the parameter name of field elements in subform with a prefix

populateParentWithSubFormKey

protected void populateParentWithSubFormKey(org.joget.apps.form.model.FormData formData)

Update parent form field value with primary key of subform based on property key of this constant PROPERTY_PARENT_SUBFORM_ID.

populateSubFormWithParentKey

protected void populateSubFormWithParentKey(org.joget.apps.form.model.FormData formData)

Update subform field value with primary key of parent form based on property key of this constant PROPERTY_SUBFORM_PARENT_ID.

checkForRecursiveForm

protected boolean checkForRecursiveForm(org.joget.apps.form.model.Element e, java.lang.String id)

Check the subform is not exist in the parent elements tree.

getSubForm

protected org.joget.apps.form.model.Form getSubForm(org.joget.apps.form.model.FormData formData)

Get From object from its children.

Interface

org.joget.apps.form.model.FormBuilderPaletteElement

• Under wflow-core module

  ภายใต้โมดูล wflow-core

• Extends interface org.joget.apps.form.model.FormBuilderEditable.

  ขยายอินเตอร์เฟส org.joget.apps.form.model.FormBuilderEditable

• Interface that describes meta information used for adding an element into the Form Builder palette.

  อินเทอร์เฟซที่อธิบายข้อมูลเมตาที่ใช้สำหรับการเพิ่มองค์ประกอบลงในจานสีตัวสร้างแบบ

Method Detail

Interface Methods

getFormBuilderCategory

public java.lang.String getFormBuilderCategory()

Category for the element in the Form Builder palette

getFormBuilderPosition

public int getFormBuilderPosition()

Ordering position. Palette to display based on the position value in ascending order for a category.

getFormBuilderIcon

public java.lang.String getFormBuilderIcon()

Path to icon for the element in the Form Builder palette. This path is relative to the context path. Return NULL to use the default icon.

getDefaultPropertyValues

public jva.lang.String getDefaultPropertyValues()

Set default Plugin Properties Options value to a new added Field in Form Builder. This method is implemented in org.joget.apps.form.model.Element.

getFormBuilderTemplate

public java.lang.String getFormBuilderTemplate()

HTML template used for display a new added field in the Form Builder

org.joget.apps.form.model.FormContainer

• Under wflow-core module

  ภายใต้โมดูล wflow-core

• This interface indicate that a Form Field Element is a container and should not create a form data column in database.

  อินเทอร์เฟซนี้บ่งชี้ว่าองค์ประกอบเขตข้อมูลฟอร์มเป็นคอนเทนเนอร์และไม่ควรสร้างคอลัมน์ข้อมูลฟอร์มในฐานข้อมูล

• No interface method is available in this interface

  ไม่มีวิธีการอินเทอร์เฟซในอินเทอร์เฟซนี้

org.joget.apps.form.model.FormOptionsElement

• Under wflow-core module

  ภายใต้โมดูล wflow-core

• This interface indicate that a Form Field Element is a multi options field such as Select Box, Check Box & Radio Button. It can use Form Options Binder to populate its options.

  อินเทอร์เฟซนี้บ่งชี้ว่าองค์ประกอบเขตข้อมูลฟอร์มเป็นฟิลด์ตัวเลือกที่หลากหลายเช่นเลือกกล่องกล่องกาเครื่องหมาย & ปุ่มตัวเลือก มันสามารถใช้ Binder ตัวเลือกแบบฟอร์มเพื่อเติมตัวเลือกของมัน

• No interface method is available in this interface

  ไม่มีวิธีการอินเทอร์เฟซในอินเทอร์เฟซนี้

org.joget.apps.form.model.FormAjaxOptionsElement

• Under wflow-core module

  ภายใต้โมดูล wflow-core

• Extends interface org.joget.apps.form.model.FormOptionsElement.

  ขยายส่วนต่อประสาน org.joget.apps.form.model.FormOptionsElement

• This interface indicate that a Form Field Element is a multi options field such as Select Box, Check Box & Radio Button. It can use Form Options Binder which implemented org.joget.apps.form.model.FormAjaxOptionsBinder to populate its options using AJAX.

  อินเทอร์เฟซนี้บ่งชี้ว่าองค์ประกอบเขตข้อมูลฟอร์มเป็นฟิลด์ตัวเลือกที่หลากหลายเช่นเลือกกล่องกล่องกาเครื่องหมาย & ปุ่มตัวเลือก มันสามารถใช้ตัวเลือก Form Options Binder ซึ่งดำเนินการ org.joget.apps.form.model.FormAjaxOptionsBinder  เพื่อเติมตัวเลือกโดยใช้ AJAX

Method Detail

Interface Methods

getControlElement

public org.joget.apps.form.model.Element getControlElement(org.joget.apps.form.model.FormData formData)

Get dependent field element which use to control the options of this field

org.joget.apps.form.model.FormReferenceDataRetriever

• Under wflow-core module

  ภายใต้โมดูล wflow-core

• Indicate that this field hold the primary keys for other form data records. The reference records can be retrieve using its interface method.

  ระบุว่าฟิลด์นี้มีคีย์หลักสำหรับบันทึกข้อมูลในแบบฟอร์มอื่น ๆ บันทึกการอ้างอิงสามารถดึงข้อมูลได้โดยใช้วิธีการอินเทอร์เฟซ

• This interface is used by org.joget.apps.form.service.FormUtil.loadFormData() and org.joget.apps.form.service.FormUtil.loadFormDataJson() method to fetch submitted form data values including data from subforms, and reference fields.

  อินเตอร์เฟสนี้ถูกใช้โดย org.joget.apps.form.service.FormUtil.loadFormData() และ org.joget.apps.form.service.FormUtil.loadFormDataJson() เพื่อดึงค่าข้อมูลฟอร์มที่ส่งมารวมถึงข้อมูลจากฟอร์มย่อยและการอ้างอิง

Method Detail

Interface Methods

loadFormRows

public org.joget.apps.form.model.FormRowSet loadFormRows(String[] primaryKeyValues, org.joget.apps.form.model.FormData formData)

Retrieve form data rows for an array of specified primary key values.

Plugin Properties Options

• The following are some mandatory properties and system predefined properties can be used in your Plugin Properties Options JSON file. Please refer to Plugin Properties Options for more information.

  ต่อไปนี้เป็นคุณสมบัติบังคับและคุณสมบัติที่กำหนดไว้ล่วงหน้าของระบบสามารถใช้ในไฟล์ JSON ตัวเลือกคุณสมบัติปลั๊กอิน โปรดดู Plugin Properties Options สำหรับข้อมูลเพิ่มเติม

Mandatory Property

id 

• • All Form Element Field must has this property appear in the Properties Options JSON.

    ฟิลด์องค์ประกอบของฟอร์มทั้งหมดต้องมีคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON

  • This is used as unique identifier of a field in a form.  

    สิ่งนี้ใช้เป็นตัวระบุที่ไม่ซ้ำกันของเขตข้อมูลในแบบฟอร์ม

    {
        name : 'id',
        label : '@@form.textfield.id@@',
        type : 'textfield',
        required : 'True',
        regex_validation : '^[a-zA-Z0-9_]+$',
        validation_message : '@@form.textfield.invalidId@@'
    }

Predefined Property  

loadBinder

• If this property appear in the Properties Options JSON, admin user is able to choose a Form Load Binder.

  หากคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON ผู้ใช้ที่เป็นผู้ดูแลระบบสามารถเลือก Form Load Binder

• The value of this property will auto convert into Form Load Binder Plugin and the plugin can be retrieved by getLoadBinder method. 

  ค่าของคุณสมบัตินี้จะแปลงเป็นปลั๊กอินโหลดแบบฟอร์มอัตโนมัติและปลั๊กอินสามารถเรียกคืนได้โดยวิธี getLoadBinder

    {
        name:'loadBinder',
        label:'@@form.subform.loadBinder@@',
        type:'elementselect',
        options_ajax:'[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormLoadElementBinder',
        url:'[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions',
        value:'org.joget.apps.form.lib.WorkflowFormBinder',
        required:'True'
    }

optionsBinder

• If this property appear in the Properties Options JSON, admin user is able to choose a Form Options Binder.

  หากคุณสมบัตินี้ปรากฏใน JSON ตัวเลือกคุณสมบัติผู้ใช้ที่เป็นผู้ดูแลระบบสามารถเลือกแบบฟอร์ม Binder ตัวเลือก

• The value of this property will auto convert into Form Options Binder Plugin and the plugin can be retrieved by getOptionsBinder method.

  ค่าของคุณสมบัตินี้จะแปลงเป็นปลั๊กอินตัวเลือกแบบฟอร์มโดยอัตโนมัติและปลั๊กอินสามารถเรียกคืนได้ด้วยวิธีการ getOptionsBinder

    {
        name : 'optionsBinder',
        label : '@@form.checkbox.chooseOptionsBinder@@',
        type : 'elementselect',
        options_ajax : '[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormLoadOptionsBinder',
        url : '[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions'
    }

permission

• If this property appear in the Properties Options JSON, admin user is able to choose a Form Permission.

  หากคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON ผู้ใช้ที่เป็นผู้ดูแลระบบสามารถเลือกแบบฟอร์มการอนุญาต

• The value of this property will auto convert into Form Permission Plugin and the plugin is used by isAuthorize method.

  ค่าของคุณสมบัตินี้จะแปลงเป็นปลั๊กอินสิทธิ์ในแบบฟอร์มโดยอัตโนมัติและปลั๊กอินถูกใช้โดยเมธอด isAuthorize

    {
        name:'permission',
        label:'@@form.form.permission@@',
        type:'elementselect',
        options_ajax:'[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormPermission',
        url:'[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions'
    }

storeBinder

• If this property appear in the Properties Options JSON, admin user is able to choose a Form Store Binder.

  หากคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON ผู้ใช้ที่เป็นผู้ดูแลระบบสามารถเลือก Form Store Binder ได้

• The value of this property will auto convert into Form Store Binder Plugin and the plugin can be retrieved by getSoreBinder method.

  ค่าของคุณสมบัตินี้จะแปลงเป็นปลั๊กอิน Form Store Binder โดยอัตโนมัติและสามารถเรียกคืนปลั๊กอินได้โดยวิธี getSoreBinder

    {
        name:'storeBinder',
        label:'@@form.form.storeBinder@@',
        type:'elementselect',
        options_ajax:'[CONTEXT_PATH]/web/property/json/getElements?classname=org.joget.apps.form.model.FormStoreElementBinder',
        url:'[CONTEXT_PATH]/web/property/json[APP_PATH]/getPropertyOptions'
    }

readonly

• System use this property to flag a field a readonly. 

  ระบบใช้คุณสมบัตินี้เพื่อตั้งค่าสถานะฟิลด์เป็นแบบอ่านอย่างเดียว

• If this property appear in the Properties Options JSON, admin user can force this field to display as readonly.

  หากคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON ผู้ใช้ที่เป็นผู้ดูแลระบบสามารถบังคับให้ฟิลด์นี้แสดงผลแบบอ่านอย่างเดียว

• This value is ignored if the parent form is set to readonly

  ค่านี้จะถูกละเว้นหากตั้งค่าฟอร์มหลักเป็นแบบอ่านอย่างเดียว

    {
        name : 'readonly',
        label : '@@form.checkbox.readonly@@',
        type : 'checkbox',
        value : 'false',
        options : [{
            value : 'true',
            label : ''
        }]
    }

readonlyLabel

• System use this property to flag a field a readonly field should display as label or not. 

  ระบบใช้คุณสมบัตินี้เพื่อตั้งค่าสถานะเขตข้อมูลเขตข้อมูลแบบอ่านอย่างเดียวควรแสดงเป็นป้ายกำกับหรือไม่

• If this property appear in the Properties Options JSON, admin user can force this field to display as label when it is readonly.

  หากคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON ผู้ใช้ที่เป็นผู้ดูแลระบบสามารถบังคับให้ฟิลด์นี้แสดงเป็นป้ายกำกับเมื่ออ่านได้อย่างเดียว

• This value is ignored if the parent form is set to display as label when it is readonly

  ค่านี้จะถูกข้ามหากฟอร์มหลักถูกตั้งค่าให้แสดงเป็นป้ายกำกับเมื่ออ่านได้อย่างเดียว

    {
        name : 'readonlyLabel',
        label : '@@form.checkbox.readonlyLabel@@',
        type : 'checkbox',
        value : 'false',
        options : [{
            value : 'true',
            label : ''
        }]
    }

workflowVariable

• If this property appear in the Properties Options JSON, admin user is set to store this field value to a workflow variable.

  หากคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON ผู้ใช้ที่เป็นผู้ดูแลระบบจะถูกตั้งค่าให้เก็บค่าฟิลด์นี้เป็นตัวแปรเวิร์กโฟลว์

• The value of this field will auto set to the mentioned workflow variable if the Form Store Binder is set to Workflow Form Binder.

  ค่าของฟิลด์นี้จะตั้งค่าโดยอัตโนมัติเป็นตัวแปรเวิร์กโฟลว์ที่กล่าวถึงหาก Form Store Binder ถูกตั้งค่าเป็น Workflow Form Binder

    {
        name : 'workflowVariable',
        label : '@@form.checkbox.workflowVariable@@',
        type : 'textfield'
    }

value

• If this property appear in the Properties Options JSON, admin user is able to set a default value for this field.

  หากคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON ผู้ใช้ที่เป็นผู้ดูแลระบบสามารถตั้งค่าเริ่มต้นสำหรับฟิลด์นี้ได้

    {
        name : 'value',
        description : '@@form.checkbox.value.desc@@',
        label : 'Default @@form.checkbox.value@@',
        type : 'textfield'
    }

validator

• If this property appear in the Properties Options JSON, admin user is able to choose a Form Validator.

  หากคุณสมบัตินี้ปรากฏในตัวเลือกคุณสมบัติ JSON ผู้ใช้ที่เป็นผู้ดูแลระบบสามารถเลือกตัวตรวจสอบความถูกต้องของฟอร์ม

• The value of this property will auto convert into Form Validator Plugin and the plugin can be retrieved by getValidator method. 

  ค่าของคุณสมบัตินี้จะแปลงเป็นปลั๊กอินตัวตรวจสอบความถูกต้องของแบบฟอร์มโดยอัตโนมัติและสามารถเรียกคืนปลั๊กอินด้วยวิธีการ getValidator

Form Field Element Template Sample

Following is a sample Form Field Template of a Text Field element. It is constructed using FreeMaker syntax. This template will be used and returned by renderTemplate method.

    @Override
    public String renderTemplate(FormData formData, Map dataModel) {
        String templateName = "textField.ftl";

        // set value
        String value = FormUtil.getElementPropertyValue(this, formData);
        dataModel.put("value", value);

        String html = FormUtil.generateElementHtml(this, formData, templateName, dataModel);
        return html;
    }

<div class="form-cell" ${elementMetaData!}>
    <label class="label">
        ${element.properties.label} <span class="form-cell-validator">${decoration}</span>
        <#if error??>
            <span class="form-error-message">${error}</span>
        </#if>
    </label>
    <#if (element.properties.readonly! == 'true' && element.properties.readonlyLabel! == 'true') >
        <div class="form-cell-value"><span>${value!?html}</span></div>
        <input id="${elementParamName!}" name="${elementParamName!}" type="hidden" value="${value!?html}" />
    <#else>
        <input id="${elementParamName!}" name="${elementParamName!}" type="text" size="${element.properties.size!}" value="${value!?html}" maxlength="${element.properties.maxlength!}" <#if error??>class="form-error-cell"</#if> <#if element.properties.readonly! == 'true'>readonly</#if> />
    </#if>
</div>

Explanations

• • A form field element template should be wrapped under a div with "form-cell" class.

    เทมเพลตองค์ประกอบของเขตข้อมูลฟอร์มควรอยู่ภายใต้ div ที่มีคลาส "form-cell"

  • ${elementMetaData!} need to put in the ".form-cell" div. It is used by Form Builder.

    $ {elementMetaData!} จำเป็นต้องใส่ div ".form-cell" มันถูกใช้โดยเครื่องมือสร้างแบบฟอร์ม

  • A useable field element template must handle the following states of a field. 

    เท็มเพลตองค์ประกอบของฟิลด์ที่ใช้ได้จะต้องจัดการกับสถานะของฟิลด์ต่อไปนี้

    
    

    • Has errors
    • Readonly
    • Readonly and needed to display as label
    • Normal display

Tutorials

• Guideline for Developing a Plugin
• File Upload Form Element Integrated with Amazon S3
• How to develop a Mood Rating Form Field

Related Community Plugins

• Check Box
  org.joget.apps.form.lib.CheckBox (wflow-core)
• Custom HTML
  org.joget.apps.form.lib.CustomHTML (wflow-core)
• Date Picker
  org.joget.apps.form.lib.DatePicker (wflow-core)
• File Upload
  org.joget.apps.form.lib.FileUpload (wflow-core)
• Grid
  org.joget.apps.form.lib.Grid (wflow-core)
• Hidden Field
  org.joget.apps.form.lib.HiddenField (wflow-core)
• Id Generator Field
  org.joget.apps.form.lib.IdGeneratorField (wflow-core)
• Password Field
  org.joget.apps.form.lib.PasswordField (wflow-core)
• Radio Button
  org.joget.apps.form.lib.Radio (wflow-core)
• Select Box
  org.joget.apps.form.lib.SelectBox (wflow-core)
• Subform
  org.joget.apps.form.lib.SubForm (wflow-core)
• Text Area
  org.joget.apps.form.lib.TextArea (wflow-core)
• Text Field
  org.joget.apps.form.lib.TextField (wflow-core)