Form Controls Example
Form Controls Example
This is a full example of all of the NetUI form control tags. In the exampe, the formTest.jsp page defines a single form containing all of the NetUI form controls. When this form is posted, the submit action is called. This will simply pass the form as a page input to the results.jsp where the full results are displayed. The example contains table layout to make the example a bit more readable.
Controller.jpf
package formControls; import org.apache.beehive.netui.pageflow.annotations.Jpf; import org.apache.beehive.netui.pageflow.PageFlowController; import org.apache.beehive.netui.pageflow.Forward; import org.apache.struts.upload.FormFile; @Jpf.Controller( simpleActions={ @Jpf.SimpleAction(name="begin", path="formTest.jsp") }, multipartHandler=Jpf.MultipartHandler.memory ) public class Controller extends PageFlowController { private String hidden = "Hidden Field"; private String[] hiddenArray = {"Hidden One", "Hidden Two"}; private boolean hiddenBoolean = true; // Hidden dataInput properties public String getHidden() { return hidden; } public String[] getHiddenArray() { return hiddenArray; } public boolean isHiddenBoolean() { return hiddenBoolean; } @Jpf.Action( forwards={@Jpf.Forward(name="success", path="results.jsp", actionOutputs={@Jpf.ActionOutput(name="bean", type=FormBean.class, required=true)} ) } ) public Forward submit(FormBean formBean) { Forward fwd = new Forward("success", "bean", formBean); return fwd; } public static class FormBean { // checkbox dataSources private boolean checkBox; private Boolean checkBoxBoolean; private String checkBoxString; public boolean isCheckBox() { return checkBox; } public void setCheckBox(boolean checkBox) { this.checkBox = checkBox; } public Boolean getCheckBoxBoolean() { return checkBoxBoolean; } public void setCheckBoxBoolean(Boolean checkBoxBoolean) { this.checkBoxBoolean = checkBoxBoolean; } public String getCheckBoxString() { return checkBoxString; } public void setCheckBoxString(String checkBoxString) { this.checkBoxString = checkBoxString; } //checkBoxGroup private String[] checkBoxGroup; public String[] getCheckBoxGroup() { return checkBoxGroup; } public void setCheckBoxGroup(String[] checkBoxGroup) { this.checkBoxGroup = checkBoxGroup; } // fileUpdate private FormFile fileUpload; public FormFile getFileUpload() { return fileUpload; } public void setFileUpload(FormFile fileUpload) { this.fileUpload = fileUpload; } // hidden private String hidden; private String[] hiddenArray; private boolean hiddenBoolean; public String getHidden() { return hidden; } public void setHidden(String hidden) { this.hidden = hidden; } public String[] getHiddenArray() { return hiddenArray; } public void setHiddenArray(String hiddenArray[]) { this.hiddenArray = hiddenArray; } public boolean isHiddenBoolean() { return hiddenBoolean; } public void setHiddenBoolean(boolean hiddenBoolean) { this.hiddenBoolean = hiddenBoolean; } // radioButtonGroup private String radioButtonGroup; public String getRadioButtonGroup() { return radioButtonGroup; } public void setRadioButtonGroup(String radioButtonGroup) { this.radioButtonGroup = radioButtonGroup; } // select private String singleSelect; private String[] multiSelect; public String getSingleSelect() { return singleSelect; } public void setSingleSelect(String singleSelect) { this.singleSelect = singleSelect; } public String[] getMultiSelect() { return multiSelect; } public void setMultiSelect(String[] multiSelect) { this.multiSelect = multiSelect; } // textArea private String textArea; public String getTextArea() { return textArea; } public void setTextArea(String textArea) { this.textArea = textArea; } // textBox private String textBox; public String getTextBox() { return textBox; } public void setTextBox(String textBox) { this.textBox = textBox; } } }
formText.jsp
<%@ page contentType="text/html;charset=UTF-8" language="java" %> <%@ taglib uri="http://beehive.apache.org/netui/tags-html-1.0" prefix="netui" %> <%@ taglib uri="http://beehive.apache.org/netui/tags-databinding-1.0" prefix="db"%> <netui:html> <head> <title>Form Test</title> <netui:base /> </head> <netui:body> <h4>Form Test</h4> <p style="color:green">This test maps all of the basic types of NetUI form controls to their underlying data types. </p> <netui:form action="submit" enctype="multipart/form-data"> <table border='1' cellspacing="0" cellpadding="0"> <tr><td valign="top"> <h4 style="color:blue">CheckBox</h4> <table> <tr><th align="right">CheckBox [boolean]</th><td><netui:checkBox dataSource="actionForm.checkBox"/></td></tr> <tr><th align="right">CheckBox [java.lang.Boolean]</th><td><netui:checkBox dataSource="actionForm.checkBoxBoolean"/></td></tr> <tr><th align="right">CheckBox [java.lang.String]</th><td><netui:checkBox dataSource="actionForm.checkBoxString"/></td></tr> </table> </td><td valign="top"> <h4 style="color:blue">CheckBoxGroup</h4> <table> <tr><th align="right" valign="top">CheckBoxGroup</th><td> <netui:checkBoxGroup dataSource="actionForm.checkBoxGroup" orientation="vertical"> <netui:checkBoxOption value="Check One"/> <netui:checkBoxOption value="Check Two"/> <netui:checkBoxOption value="Check Three"/> <netui:checkBoxOption value="Check Four"/> </netui:checkBoxGroup> </td></tr> </table> </td></tr> <tr><td valign="top"> <h4 style="color:blue">FileUpload</h4> <table> <tr><th align="right">FileUpload</th><td><netui:fileUpload dataSource="actionForm.fileUpload"/></td></tr> </table> </td><td valign="top"> <h4 style="color:blue">Hidden</h4> <table> <tr><th align="right">Hidden</th><td><netui:hidden dataInput="${pageFlow.hidden}" dataSource="actionForm.hidden"/></td></tr> <tr><th align="right">Hidden Array[0]</th><td><netui:hidden dataInput="${pageFlow.hiddenArray[0]}" dataSource="actionForm.hiddenArray"/></td></tr> <tr><th align="right">Hidden Array[1]</th><td><netui:hidden dataInput="${pageFlow.hiddenArray[1]}" dataSource="actionForm.hiddenArray"/></td></tr> <tr><th align="right">Hidden</th><td><netui:hidden dataInput="${pageFlow.hiddenBoolean}" dataSource="actionForm.hiddenBoolean"/></td></tr> </table> </td></tr> <tr><td valign="top"> <h4 style="color:blue">RadioButtonGroup</h4> <table> <tr><th align="right" valign="top">RadioButtonGroup</th><td> <netui:radioButtonGroup dataSource="actionForm.radioButtonGroup" orientation="vertical"> <netui:radioButtonOption value="Radio One"/> <netui:radioButtonOption value="Radio Two"/> <netui:radioButtonOption value="Radio Three"/> <netui:radioButtonOption value="Radio Four"/> </netui:radioButtonGroup> </td></tr> </table> </td><td valign="top"> <h4 style="color:blue">Select</h4> <table> <tr><th align="right">SingleSelect</th><td> <netui:select dataSource="actionForm.singleSelect"> <netui:selectOption value="SelectOne">Select One</netui:selectOption> <netui:selectOption value="SelectTwo">Select Two</netui:selectOption> <netui:selectOption value="SelectThree">Select Three</netui:selectOption> <netui:selectOption value="SelectFour">Select Four</netui:selectOption> </netui:select> </td></tr> <tr><th align="right">MulitSelect</th><td> <netui:select multiple="true" dataSource="actionForm.multiSelect"> <netui:selectOption value="SelectOne">Select One</netui:selectOption> <netui:selectOption value="SelectTwo">Select Two</netui:selectOption> <netui:selectOption value="SelectThree">Select Three</netui:selectOption> <netui:selectOption value="SelectFour">Select Four</netui:selectOption> </netui:select> </td></tr> </table> </td></tr> <tr><td valign="top"> <h4 style="color:blue">TextArea</h4> <p><netui:textArea dataSource="actionForm.textArea" /></p> </td><td valign="top"> <h4 style="color:blue">TextBox</h4> <p><netui:textBox dataSource="actionForm.textBox" /></p> </td></tr> <tr><th align="right">Button</th><td><netui:button type="submit">Submit the Form</netui:button></td></tr> <tr><th align="right">ImageButton</th><td><netui:imageButton src="insert.gif"/></td></tr> <tr><th align="right">Anchor</th><td><netui:anchor formSubmit="true">Submit Form Through a Link</netui:anchor></td></tr> </table> </netui:form> </netui:body> </netui:html>
results.jsp
<%@ page language="java" contentType="text/html;charset=UTF-8"%> <%@ taglib uri="http://beehive.apache.org/netui/tags-html-1.0" prefix="netui" %> <%@ taglib uri="http://beehive.apache.org/netui/tags-databinding-1.0" prefix="netui-data"%> <netui-data:declarePageInput name="bean" type="FormBean" /> <netui:html> <head> <title>Form Post Results</title> <netui:base/> </head> <netui:body> <h4>Form Post Requests</h4> <p style="color:green">This page displays the results of the form post. The posted form is passed to the page as a PageInput. We then bind to the pageInput and display all of the resulting values. </p> <table border='1' cellspacing="0" cellpadding="0"> <tr><td valign="top"> <h4 style="color:blue">CheckBox</h4> <table> <tr><th align="right">CheckBox [boolean]</th><td>${pageInput.bean.checkBox}</td></tr> <tr><th align="right">CheckBox [java.lang.Boolean]</th><td>${pageInput.bean.checkBoxBoolean}</td></tr> <tr><th align="right">CheckBox [java.lang.String]</th><td>${pageInput.bean.checkBoxString}</td></tr> </table> </td><td valign="top"> <h4 style="color:blue">CheckBoxGroup</h4> <table> <netui-data:repeater dataSource="pageInput.bean.checkBoxGroup"> <tr><td>${container.item}</td></tr> </netui-data:repeater> </table> </td></tr> <tr><td valign="top"> <h4 style="color:blue">FileUpload</h4> <p> File Name: ${pageInput.bean.fileUpload.fileName}<br> File Size: ${pageInput.bean.fileUpload.fileSize}<br> </p> </td><td valign="top"> <h4 style="color:blue">Hidden</h4> <table> <tr><th align="right">Hidden</th><td>${pageInput.bean.hidden}</td></tr> <tr><th align="right">Hidden Array[0]</th><td>${pageInput.bean.hiddenArray[0]}</td></tr> <tr><th align="right">Hidden Array[1]</th><td>${pageInput.bean.hiddenArray[1]}</td></tr> <tr><th align="right">HiddenBoolean</th><td>${pageInput.bean.hiddenBoolean}</td></tr> </table> </td></tr> <tr><td valign="top"> <h4 style="color:blue">RadioButtonGroup</h4> <table> <netui-data:repeater dataSource="pageInput.bean.radioButtonGroup"> <tr><td>${container.item}</td></tr> </netui-data:repeater> </table> </td><td valign="top"> <h4 style="color:blue">Select</h4> <table> <tr><th align="right">SingleSelect</th><td>${pageInput.bean.singleSelect}</td></tr> <tr><th align="right">SingleSelect</th> <td> <table> <netui-data:repeater dataSource="pageInput.bean.multiSelect"> <tr><td>${container.item}</td></tr> </netui-data:repeater> </table> </td></tr> </table> </td></tr> <tr><td valign="top"> <h4 style="color:blue">TextArea</h4> <p> ${pageInput.bean.textArea}<br> </p> </td><td valign="top"> <h4 style="color:blue">TextBox</h4> <p> ${pageInput.bean.textBox}<br> </p> </td></tr> </table> <netui:anchor action="begin">Return to Form</netui:anchor> </netui:body> </netui:html>