成都网站建设思图佳,渭南市住房和城乡建设部网站,浙江杭州,陕西建设网官方网站新的PrimeFaces扩展版本0.5.0带来了新的DynaForm组件。 通常#xff0c;如果知道行/列的数量#xff0c;元素的位置等#xff0c;则可以通过h#xff1a;panelGrid或p#xff1a;panelGrid来构建非常简单的表单。 对于静态表单#xff0c;这是正确的。 但是#xff0c;如… 新的PrimeFaces扩展版本0.5.0带来了新的DynaForm组件。 通常如果知道行/列的数量元素的位置等则可以通过hpanelGrid或ppanelGrid来构建非常简单的表单。 对于静态表单这是正确的。 但是如果在运行时动态描述表单则无法使用hpanelGrid或ppanelGrid。 例如如果整个表单的定义都放在数据库或XML文件中。 DynaForm使得构建带有标签输入选择和任何其他元素的动态表单成为可能。 没有限制。 在展示柜中探索其所有功能。 让我们展示如何构建一个简单的动态表单。 主要步骤 创建模型实例DynaFormModel model new DynaFormModel; 将行添加到常规网格DynaFormRow row model.createRegularRow; 添加标签DynaFormLabel标签 row.addLabelvaluecolspanrowspan; 添加可编辑控件DynaFormControl控件 row.addControl数据类型colspanrowspan; 设置标签和控件之间的关系可选label.setForControlcontrol; 根据需要重复最后四个步骤。 从UI角度看会是什么样 表单验证失败后的屏幕截图 主要标签是pedynaForm。 子标记pedynaFormControl匹配在Java控件中通过“ type”属性创建的标记。 这通常是“一对多”的关系。 下面列出了上面动态形式的XHTML / Java控制器bean和模型代码。 h:panelGroup iddynaFormGroupp:messages idmessages showSummarytrue/pe:dynaForm iddynaForm value#{dynaFormController.model} vardatape:dynaFormControl typeinput fortxtp:inputText idtxt value#{data.value} required#{data.required}//pe:dynaFormControlpe:dynaFormControl typecalendar forcal styleClasscalendarp:calendar idcal value#{data.value} required#{data.required} showOnbutton//pe:dynaFormControlpe:dynaFormControl typeselect forsel styleClassselectp:selectOneMenu idsel value#{data.value} required#{data.required}f:selectItems value#{dynaFormController.languages}//p:selectOneMenu/pe:dynaFormControlpe:dynaFormControl typetextarea fortareap:inputTextarea idtarea value#{data.value} required#{data.required} autoResizefalse//pe:dynaFormControlpe:dynaFormControl typerating forratp:rating idrat value#{data.value} required#{data.required}//pe:dynaFormControlf:facet namebuttonBarp:commandButton valueSubmit action#{dynaFormController.submitForm}processdynaForm update_mainForm_dynaFormGroup/p:commandButton typereset valueReset stylemargin-left: 5px;//f:facet/pe:dynaForm
/h:panelGroupManagedBean
ViewScoped
public class DynaFormController implements Serializable {private DynaFormModel model;private static ListSelectItem LANGUAGES new ArrayListSelectItem();public DynaFormController() {model new DynaFormModel();// add rows, labels and editable controls// set relationship between label and editable controls to support outputLabel with for attribute// 1. rowDynaFormRow row model.createRegularRow();DynaFormLabel label11 row.addLabel(Author, 1, 1);DynaFormControl control12 row.addControl(new BookProperty(Author, true), input, 1, 1);label11.setForControl(control12);DynaFormLabel label13 row.addLabel(ISBN, 1, 1);DynaFormControl control14 row.addControl(new BookProperty(ISBN, true), input, 1, 1);label13.setForControl(control14);// 2. rowrow model.createRegularRow();DynaFormLabel label21 row.addLabel(Title, 1, 1);DynaFormControl control22 row.addControl(new BookProperty(Title, false), input, 3, 1);label21.setForControl(control22);// 3. rowrow model.createRegularRow();DynaFormLabel label31 row.addLabel(Publisher, 1, 1);DynaFormControl control32 row.addControl(new BookProperty(Publisher, false), input, 1, 1);label31.setForControl(control32);DynaFormLabel label33 row.addLabel(Published on, 1, 1);DynaFormControl control34 row.addControl(new BookProperty(Published on, false), calendar, 1, 1);label33.setForControl(control34);// 4. rowrow model.createRegularRow();DynaFormLabel label41 row.addLabel(Language, 1, 1);DynaFormControl control42 row.addControl(new BookProperty(Language, false), select, 1, 1);label41.setForControl(control42);DynaFormLabel label43 row.addLabel(Description, 1, 2);DynaFormControl control44 row.addControl(new BookProperty(Description, false), textarea, 1, 2);label43.setForControl(control44);// 5. rowrow model.createRegularRow();DynaFormLabel label51 row.addLabel(Rating, 1, 1);DynaFormControl control52 row.addControl(new BookProperty(Rating, 3, true), rating, 1, 1);label51.setForControl(control52);}public DynaFormModel getModel() {return model;}public String submitForm() {... // do something}public ListSelectItem getLanguages() {if (LANGUAGES.isEmpty()) {LANGUAGES.add(new SelectItem(en, English));LANGUAGES.add(new SelectItem(de, German));LANGUAGES.add(new SelectItem(ru, Russian));LANGUAGES.add(new SelectItem(tr, Turkish));}return LANGUAGES;}
}public class BookProperty implements Serializable {private String name;private Object value;private boolean required;public BookProperty(String name, boolean required) {this.name name;this.required required;}public BookProperty(String name, Object value, boolean required) {this.name name;this.value value;this.required required;}// getter // setter
} 您会看到一个重要功能是对标签的内置支持。 DynaForm自动呈现标签-无需编写poutputLabel。 另一个功能是autoSubmit标志。 它允许在URL中传递表单参数在页面加载时构建表单并自动提交。 更多亮点可扩展的扩展视图区域网格打开/关闭状态保存小部件的客户端API各种方面。 接下来的屏幕截图展示了如何使用字段上方的标签和诸如PrimeFaces分隔符之类的各种元素构建动态表单。 通过单击“切换模型”链接可以切换此示例中的两种形式。 注意带有pedynaForm的XHTML代码保持不变只有Java模型被更改。 探索用例中的相应代码还有另一种形式 。 参考 动态表单JSF世界在我们的JCG合作伙伴 Oleg Varaksin的软件开发博客上 很期待 。 翻译自: https://www.javacodegeeks.com/2012/06/dynamic-forms-jsf-world-was-long.html
