天天看点

【AEM Forms学习】(三)表格字段布局调整

【写在前面】

看这篇文章前,可以先看看上一篇  【AEM Forms学习】(一)通过生成Form Fragment实现表单区域复用

【正文】

点击编辑之前创建的Address Fragment

【AEM Forms学习】(三)表格字段布局调整

选中Root Panel,点击编辑

【AEM Forms学习】(三)表格字段布局调整

将Number of Columns设为3,也就是每行展示3个Column

【AEM Forms学习】(三)表格字段布局调整

再选中Name这个Text Box,点击编辑

【AEM Forms学习】(三)表格字段布局调整

将Colspan属性设为3,也就是说Root Panel一行有3个Column,而Name这个Text Box 占用3个Column的宽度,也就是独占一行,效果如下

【AEM Forms学习】(三)表格字段布局调整

地址类的Text Box,每个占1个Column,其他的Text Box每个占3个Column,调整后如下

【AEM Forms学习】(三)表格字段布局调整

这样的表格布局,就显得更加的合理