Struts2 datetimepicker size

Question

I want to increase the size of the Calendar view because the default size is too small for my web application. I've tried to add a cssClass to the datetimepicker tag but it doesn't work, even if I change the width or height the only thing it changes is the field, not the calendar itself.

I'll put an image so you can understand better the problem that I have:

datetimepicker problem

The thing is that the text from the field is correctly viewed, but when I click the calendar button, it shows that tiny view and it's extremelly difficult to pick one date.

The code for the datetimepicker is this:

<sx:datetimepicker name="start_date" displayFormat="dd-MMM-yyyy" value="%{'today'}" />

Any guess?

PhilipJFry87 PhilipJFry87 · Accepted Answer · 2013-04-16T09:05:59

Ok, It's finally solved:

First I tried to find the file named datefilepicker.ftl inside the struts2-core.jar but I didn't find anything similar. So after a few hours trying to find which was the correct template of datetimepicker without any luck, I tried to solve my problem using JQuery because when I was searching for the answer I found out a datepicker tutorial using this library.

There's a plugin called Struts2-JQuery that provides you with ajax functionality and therefore with multiple customizations in different widgets.

It's quite easy to install, I just had to download the correct .jar which for me it was Version 3.5.1 ( jQuery 1.8.3, jQuery UI 1.9.2 ). Once I'd downloaded the file, I just had to paste it in the lib folder inside my project. After doing that, I added this line at the beginning of the .jsp file:

<%@ taglib prefix="sj" uri="/struts-jquery-tags"%>

With these steps I had jquery functionality inside my .jsp file, so the only thing left to do is to add the datepicker widget:

First I chose the jquerytheme I wanted for my widget, just like this:

<head>
<sj:head jquerytheme="flick"/>
...
</head>

And then, I added my datepicker widget:

<sj:datepicker name="start_date" displayFormat="dd-MM-yy" value="today"/>

And that's it.

If you want to resize the datepicker calendar see the answer of this post:

How to resize the jQuery DatePicker control

Struts2 datetimepicker size

2 Answers