Pages Navigation Menu

Coding is much easier than you think

Struts 2 datetimepicker example

 
datePicker
 
To create a date time pick component in struts 2, please follow this two steps :
 
1. Add struts2-dojo-plugin.jar in your class path.
2. Include the “struts-dojo-tags” tag and its header in your jsp page
 
** UPDATE: Struts 2 Complete tutorial now available here.
 

<%@ taglib prefix="sx" uri="/struts-dojo-tags" %>
<html>
<head>
<sx:head />
</head>

 

Recommended Article

 
Datetime picker in struts 2 using jquery jar
 

Action class

 
DatePickerAction.java
 

package com.simplecode.action;

import java.util.Date;

import com.opensymphony.xwork2.Action;

public class DatePickerAction implements Action 
{
	private Date birthDay;

	public Date getBirthDay() 
	{
		return birthDay;
	}

	public void setBirthDay(Date birthDay) 
	{
		this.birthDay = birthDay;
	}

	public String execute() throws Exception 
	{
		return SUCCESS;
	}
}

 

JSP Page

 

datepicker.jsp
 

<%@ taglib prefix="s" uri="/struts-tags"%>
<%@ taglib prefix="sx" uri="/struts-dojo-tags"%>
<html>
<head>
<title>Date Picker</title>
<sx:head />
</head>
<body>
<h3>Struts2 Date Picker example</h3>
<s:form action="resultAction">
<sx:datetimepicker name="birthDay" label="Format (dd-MM-yyyy)"
	displayFormat="dd-MM-yyyy" required="true" />	
<s:submit value="submit" name="submit" />
</s:form>
</body>
</html>

 

result.jsp
 

<%@ taglib prefix="s" uri="/struts-tags"%>
<html>
<head>
<title>Date Picker Result</title>
</head>
<body>
<h3>Struts2 Date Picker example</h3>
Birthday : <s:property value="birthDay" />
</body>
</html>

 

struts.xml

 

<struts>
<package name="" namespace="/jsp" extends="struts-default">
<action name="dateTimePicker" class="com.simplecode.action.DatePickerAction">
	<result name="success">/jsp/result.jsp</result>
</action>
</package>
</struts>

 

Demo

 
On running the above example

  http://localhost:8089/Struts2_DatePicker/

 
DateTime picker
 
Now on clicking the date picker icon, the calendar gets displayed as shown below.

On expanding date picker icon
 
On selecting the date and clicking the submit button, the following output is obtained

output date picker
 
Suppose you want to include a static date in jsp, then the following code can be used
 

<sx:datetimepicker name="staticDateFromJsp" label="Format (dd-MMM-yyyy)"
	displayFormat="dd-MMM-yyyy" value="%{'1989-12-19'}" />

 
Suppose you want to include a static date in jsp, then the following code can be used
 

<sx:datetimepicker name="todaysDate" label="Format (dd-MMM-yyyy)"
	displayFormat="dd-MMM-yyyy" value="%{'today'}" />

 
So now when you run the application, these values will be displayed in the jsp page. Inorder to make this values appear in the result page, you just need to include the getter and setter for staticDateFromJsp and todaysDate in the action class, and render it via property tag in result.jsp page
 

 

Another must read article

 

About Mohaideen Jamil


Am currently working as a Struts 2 Developer in a reputed IT Organisations. I can help you with teaching Core java and Struts 2. Follow me on Facebook or Google Plus. If you like my tutorials, consider making a donation to this charity, thanks.

  • raja

    Hi I tried your example.I am not able to view date time picker.

  • Pradeep Chaubey

    Hi Jamil, Thanks for nice tutorial. After making this change in struts.xml. I am not able to view the data time picker. We need to make the theme simple to override the default style. Can you please suggest how to see the data time picker in the UI in this condition.
    Thanks.

    -Pradeep

    • http://www.simplecodestuffs.com Mohaideen Jamil

      Hi Pradeep,

      Can you share the changes you made in struts.xml file.
      To override theme properly please view the following article.

      Override Default Theme in Struts 2