Apache > Beehive
 

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>