Apache wicket text field example

If you are creating a first wicket project , then  please go through my earlier tutorial how to configure and build apache wicket?. In this tutorial, let us see how to design a wicket web form using TextField component to accept inputs.

In this example, let us design a employee form accepting employee code , employee name and mobile number where code and name are mandatory.

wicket text 1

 

The following code shows how to create a basic Wicket form with 3 input TextFields in a page

EmployeeInputPage.Java

package com.javaonline;
import org.apache.wicket.markup.html.WebPage;
import org.apache.wicket.markup.html.form.Form;
import org.apache.wicket.markup.html.form.TextField;
import org.apache.wicket.model.Model;
import org.apache.wicket.request.mapper.parameter.PageParameters;

	public class EmployeeInputPage extends WebPage {
		Form<?> form = null;

		public EmployeeInputPage(final PageParameters page) throws Exception {

		   super();

		    final TextField code = new TextField("empCode", Model.of(""));
			final TextField name = new TextField("name",  Model.of(""));
			 final  TextField mobile = new TextField("mobile", Model.of(""));
				code.setRequired(true);
				name.setRequired(true);
				mobile.setRequired(false);

			form = new Form("empForm") {

				public void onSubmit() {

					final String empCode = (String) code.getModelObject();
					final String empName = (String) name.getModelObject();
					final String mobNo = (String) mobile.getModelObject();

					page.add("empCode", empCode);
					page.add("name", empName);
					if (mobNo==null)
						page.add("mobile", "");
					else
						page.add("mobile", mobNo);

						try {
							setResponsePage(new Acknowledgement(page));
						} catch (Exception e) {
							// TODO Auto-generated catch block
							e.printStackTrace();
						}
				}

			};

					form.add(code);
					form.add(name);
					form.add(mobile);
					add(form);

		}
	}

The corresponding EmployeeInputPage.html is given below

<html>
	<head>
  		<title>Employee Form</title>
	</head>
	<body>
		<form id="empForm1" method="get" wicket:id="empForm">
  			<fieldset>
    			<legend style="color: #F90">Employee Input</legend>
    				<span>Employee Code: </span><input wicket:id="empCode" type="text" id="empCode1" /><br/>
    				<span>Employee Name: </span><input wicket:id="name" type="text" id="name1" /><br/>
    				<span>Mobile Number: </span><input wicket:id="mobile" type="text" id="mobile1" />
    				<p>
    					<input type="submit" name="Submit" value="Submit"/>
    				</p>
  	   	    </fieldset>
		</form>
	</body>
</html>

The Acknowledgement java page which retrieves empCode, name, mobile parameters sent by the previous page and puts in labels is given below

Acknowledgement.java

package com.javaonline;

import org.apache.wicket.markup.html.WebPage;
import org.apache.wicket.markup.html.basic.Label;
import org.apache.wicket.request.mapper.parameter.PageParameters;

public class Acknowledgement extends WebPage {

	public Acknowledgement(final PageParameters page) throws Exception {

			Label code = new Label("code", page.get("empCode"));
			Label name = new Label("name", page.get("name"));
			Label mobile = new Label("mobile", page.get("mobile"));

			add(code);
			add(name);
			add(mobile);
	}
}

 

The corresponding Acknowledgement.html is given below

<html>
<body>
    <span>Employee Code :</span><span wicket:id="code"></span><br/>
    <span> Employee Name :</span><span wicket:id="name"></span><br/>
    <span> Mobile Number :</span><span wicket:id="mobile"></span>
</body>
</html> 

and the Starter page to load home page is given below

package com.javaonline;

import org.apache.wicket.markup.html.WebPage;
import org.apache.wicket.protocol.http.WebApplication;

public class WicketStarter extends WebApplication
{
/**
* @see org.apache.wicket.Application#getHomePage()
*/
@Override
public Class&lt;? extends WebPage&gt; getHomePage()
{
return EmployeeInputPage.class;
}

@Override
public void init()
{
super.init();

}
}

Add the below filter lines in web.xml

	<filter>
		<filter-name>wicket.wickettextfieldexample</filter-name>
		<filter-class>org.apache.wicket.protocol.http.WicketFilter</filter-class>
		<init-param>
			<param-name>applicationClassName</param-name>
			<param-value>com.javaonline.WicketStarter</param-value>
		</init-param>
	</filter>

For the complete web.xml, please visit ….
Running the above project you will get the above page.

Fill the details  and Submit

wicket text2

Output :

wicket text3
Reference : apache wicket form

You may also like

Leave a Reply

Be the First to Comment!