- January 12, 2022
- Advaiya
There are many options available that help achieve the desired appearance and functionality. Custom and default editors can be configured along with different orientations and layouts. The Kendo UI Form widget can be used to create and configure forms using various configuration options.
Recently we came across a requirement to design a survey form. This form needs to be dynamic. During working on this assignment, we faced many challenges, and with the help of this blog, I want to share the same with you.
There are several properties associated with each item–
Field | Field Name from data |
Label | Label which you want to display |
Validation | If we want to apply any validation on the field |
Editor | Type of editor needed for the field this could be RadioGroup or CheckBoxGroup |
EditorOptions | Editor properties can be set here |
With the above properties an array can be created which assign as form item.
Eg. SurveyItem= [{field: “Field1”, label: “label1”, validation: {required: true}},
{field: “Field2”, label: “label2”}, {field: “Field3”, label: “label3”}]
By pushing each element in an array and set the array as item property of the form.
To accommodate multiple forms on one page the json format of Items should be like below-
There is no out-of-the-box setting available for this, but we can achieve this using CSS
Sometimes, we only want to show some text on the form without any control. There is not out of box property associated with this. With the help of CSS, we can achieve this.
Kendo UI form is new and robust control of Kendo UI. There is not much out-of-the-box customization available, but creating whole dynamic page forms is quite helpful.