Configurator-Version
Create varying layout-boxes with MIGX - Configurator Version
Its possible to use the MIGX - Configurator - CMP to create switchable formtabs. This Tutorial will show you, how. It descibes just the differences to the used Version.
The MIGX-Tv
Create a new TV.
General Information
Name
MultiColumn
Input Options
Input-type
migx
Configurations
layout_1
The MIGX-Configurations
Create three MIGX - Configurations in the MIGX - Configurator - CMP
layout_1
Name: layout_1 unique MIGX ID: layout_1
layout_2
Name: layout_2 unique MIGX ID: layout_2
layout_3
Name: layout_3 unique MIGX ID: layout_3
Add Formtabs and Columns
Open each Configuration with 'edit raw'
layout_1
Formtabs
[{
"caption": "Row Format",
"fields": [{
"field": "fake",
"inputTVtype": "hidden"
}, {
"field": "cell_2_image",
"caption": "Image",
"inputTVtype": "hidden"
}, {
"field": "cell_2_headline",
"caption": "Headline",
"inputTVtype": "hidden"
}, {
"field": "cell_2_content",
"caption": "Content",
"inputTVtype": "hidden"
}, {
"field": "cell_3_image",
"caption": "Image",
"inputTVtype": "hidden"
}, {
"field": "cell_3_headline",
"caption": "Headline",
"inputTVtype": "hidden"
}, {
"field": "cell_3_content",
"caption": "Content",
"inputTVtype": "hidden"
}]
}, {
"caption": "First",
"fields": [{
"field": "cell_1_image",
"caption": "Image",
"inputTVtype": "image"
}, {
"field": "cell_1_headline",
"caption": "Headline"
}, {
"field": "cell_1_content",
"caption": "Content",
"inputTVtype": "richtext"
}]
}]
under Multiple Formtabs select:
layout_1,layout_2,layout_3
Columns
[{
"header": "Row Format",
"width": "30",
"sortable": "true",
"dataIndex": "MIGX_formname"
}, {
"header": "First",
"width": "160",
"sortable": "false",
"dataIndex": "cell_1_image",
"renderer": "this.renderImage"
}, {
"header": "Second",
"width": "160",
"sortable": "false",
"dataIndex": "cell_2_image",
"renderer": "this.renderImage"
}, {
"header": "Third",
"width": "160",
"sortable": "false",
"dataIndex": "cell_3_image",
"renderer": "this.renderImage"
}]
layout_2
Formtabs
[{
"caption": "Row Format",
"fields": [{
"field": "fake",
"inputTVtype": "hidden"
}, {
"field": "cell_3_image",
"caption": "Image",
"inputTVtype": "hidden"
}, {
"field": "cell_3_headline",
"caption": "Headline",
"inputTVtype": "hidden"
}, {
"field": "cell_3_content",
"caption": "Content",
"inputTVtype": "hidden"
}]
}, {
"caption": "First",
"fields": [{
"field": "cell_1_image",
"caption": "Image",
"inputTVtype": "image"
}, {
"field": "cell_1_headline",
"caption": "Headline"
}, {
"field": "cell_1_content",
"caption": "Content",
"inputTVtype": "richtext"
}]
}, {
"caption": "Second",
"fields": [{
"field": "cell_2_image",
"caption": "Image",
"inputTVtype": "image"
}, {
"field": "cell_2_headline",
"caption": "Headline"
}, {
"field": "cell_2_content",
"caption": "Content",
"inputTVtype": "richtext"
}]
}]
layout_3
Formtabs
[{
"caption": "Row Format",
"fields": [{
"field": "fake",
"inputTVtype": "hidden"
}]
}, {
"caption": "First",
"fields": [{
"field": "cell_1_image",
"caption": "Image",
"inputTVtype": "image"
}, {
"field": "cell_1_headline",
"caption": "Headline"
}, {
"field": "cell_1_content",
"caption": "Content",
"inputTVtype": "richtext"
}]
}, {
"caption": "Second",
"fields": [{
"field": "cell_2_image",
"caption": "Image",
"inputTVtype": "image"
}, {
"field": "cell_2_headline",
"caption": "Headline"
}, {
"field": "cell_2_content",
"caption": "Content",
"inputTVtype": "richtext"
}]
}, {
"caption": "Third",
"fields": [{
"field": "cell_3_image",
"caption": "Image",
"inputTVtype": "image"
}, {
"field": "cell_3_headline",
"caption": "Headline"
}, {
"field": "cell_3_content",
"caption": "Content",
"inputTVtype": "richtext"
}]
}]
Make sure, you have all the same fieldnames in all formtab-setups. Unused fields in hidden-fields. Otherwise you will loose values, when you switch between formtabs.