Appfuse-Maven Date picker not being shown

Question

I have developed a webmodule using Appfuse. I had a predefined database with few tables which had Date field in it. I am able to successfully run appfuse using Jetty, However instead of showing me the date picker it is just showing Text field where i have to type date manually. Is there any way to get date picker by default?

I did the following steps for generating templates

• appfuse:gen-model: Generates Java classes from database tables.
• appfuse:gen: Generates and installs Tests, DAOs, Managers, Controllers and Views based on POJOs.
• appfuse:remove: Removes artifacts installed appfuse:gen.
• appfuse:full-source: Converts AppFuse basic projects to full-source with no AppFuse dependencies. Also renames packages to match your project's groupId.
• appfuse:copy-templates: Copies FreeMarker templates for CRUD generation into src/test/resources/appfuse. These templates can be customized to fit your needs.

Answer 1

If your property type is java.util.Date, you should get a date picker for your text field. If not, check your JavaScript console, there may be an error. You can also try changing <input type="text"> to <input type="date">.

This is the date picker technique AppFuse uses by default:

1. Add a dependency to the WebJar:

   <dependency>
       <groupId>org.webjars</groupId>
       <artifactId>bootstrap-datepicker</artifactId>
       <version>1.3.1</version>
   </dependency>
   

2. Then use class="date" on the date fields and use the following HTML/JS to initialize the field.

   <link rel="stylesheet" type="text/css" media="all" href="/webjars/bootstrap-datepicker/1.3.1/css/datepicker.css" />
   <script type="text/javascript" src="/webjars/bootstrap-datepicker/1.3.1/js/bootstrap-datepicker.js"></script>
   <script type="text/javascript">
       $(document).ready(function() {
           $('.date').datepicker({format: "mm/dd/yyyy", weekStart: "0"});
       });
   </script>