Datepicker not working in JSP
<p>I have the following JSP file and everytime I try to fill the date field in the form it doesn't show the datepicker. This is my employeeForm.jsp:</p>

<pre><code>&lt;%@ page session="false"%&gt;
&lt;%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%&gt;
&lt;%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%&gt;
&lt;%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%&gt;
&lt;%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%&gt;


&lt;html&gt;

&lt;jsp:include page="../common/header.jsp" /&gt;

&lt;head&gt;
    &lt;link rel="stylesheet" type="text/css" href="style.css" media="screen" /&gt;
    &lt;script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.11/jquery-ui.min.js"&gt;&lt;/script&gt;
    &lt;script type="text/javascript"&gt;
        $( function(){
            $("#date").datepicker(); 
        });
    &lt;/script&gt;
&lt;/head&gt;

&lt;body&gt;
    &lt;div class="container"&gt;


    &lt;spring:url value="/employees" var="employeeActionUrl" /&gt;
    &lt;form:form method="POST" modelAttribute="employeeForm" class="form-horizontal" action="${employeeActionUrl}"&gt;

        &lt;spring:bind path="name"&gt;
            &lt;div class="form-group ${status.error ? 'has-error' : ''}"&gt;
                &lt;label class="col-sm-2 control-label"&gt;Name&lt;/label&gt;
                &lt;div class="col-sm-10"&gt;
                    &lt;form:input path="name" type="text" class="form-control" id="name" placeholder="Name"/&gt;
                    &lt;form:errors path="name" class="control-label" /&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/spring:bind&gt;
        &lt;spring:bind path="ife"&gt;
            &lt;div class="form-group ${status.error ? 'has-error' : ''}"&gt;
                &lt;label class="col-sm-2 control-label"&gt;IFE&lt;/label&gt;
                &lt;div class="col-sm-10"&gt;
                    &lt;form:input path="ife" type="text" class="form-control" id="ife" placeholder="IFE"/&gt;
                    &lt;form:errors path="ife" class="control-label" /&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/spring:bind&gt;
        &lt;spring:bind path="profile"&gt;
            &lt;div class="form-group ${status.error ? 'has-error' : ''}"&gt;
                &lt;label class="col-sm-2 control-label"&gt;Profile&lt;/label&gt;
                &lt;div class="col-sm-10"&gt;
                    &lt;form:input path="profile" type="text" class="form-control" id="profile" placeholder="Profile"/&gt;
                    &lt;form:errors path="profile" class="control-label" /&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/spring:bind&gt;

        &lt;spring:bind path="department"&gt;
            &lt;div class="form-group ${status.error ? 'has-error' : ''}"&gt;
                &lt;label class="col-sm-2 control-label"&gt;Departament&lt;/label&gt;
                &lt;div class="col-sm-10"&gt;
                    &lt;form:input path="department" type="text" class="form-control" id="department" placeholder="Departament"/&gt;
                    &lt;form:errors path="department" class="control-label" /&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/spring:bind&gt;
        &lt;spring:bind path="date"&gt;
            &lt;div class="form-group ${status.error ? 'has-error' : ''}"&gt;
                &lt;label class="col-sm-2 control-label"&gt;Date&lt;/label&gt;
                &lt;div class="col-sm-10"&gt;
                    &lt;form:input path="date" type="text" id="date"/&gt;
                &lt;/div&gt;
            &lt;/div&gt;
        &lt;/spring:bind&gt;

        &lt;div class="form-actions"&gt;
            &lt;input type="submit" value="Submit" class="btn btn-primary btn-sm"&gt;
        &lt;/div&gt;
    &lt;/form:form&gt;

    &lt;/div&gt;

&lt;jsp:include page="../common/footer.jsp"/&gt;

&lt;/body&gt;
&lt;/html&gt;
</code></pre>

<p>This is my header.jsp:</p>

<pre><code>&lt;%@ page session="false"%&gt;
&lt;%@ taglib prefix="spring" uri="http://www.springframework.org/tags"%&gt;
&lt;%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%&gt;
&lt;%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%&gt;
&lt;%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%&gt;

&lt;head&gt;
&lt;title&gt;ERP&lt;/title&gt;

&lt;spring:url value="/resources/admin-lte/bootstrap/css/hello.css" var="coreCss" /&gt;
&lt;spring:url value="/resources/admin-lte/bootstrap/css/bootstrap.min.css"
    var="bootstrapCss" /&gt;
&lt;spring:url value="/resources/admin-lte/plugins/jquery-ui/jquery-ui.min.css"
    var="jqueryuiCss"/&gt;
&lt;link href="${bootstrapCss}" rel="stylesheet" /&gt;
&lt;link href="${coreCss}" rel="stylesheet" /&gt;
&lt;link href="${jqueryuiCss}" rel="stylesheet" /&gt;
&lt;/head&gt;

&lt;spring:url value="/" var="urlHome" /&gt;
&lt;spring:url value="/employee/add" var="urlAddEmployee" /&gt;

&lt;nav class="navbar navbar-inverse "&gt;
    &lt;div class="container"&gt;
        &lt;div class="navbar-header"&gt;
            &lt;a class="navbar-brand" href="${urlHome}"&gt;ERP&lt;/a&gt;
        &lt;/div&gt;
        &lt;div id="navbar"&gt;
            &lt;ul class="nav navbar-nav navbar-right"&gt;
                &lt;li class="active"&gt;&lt;a href="${urlAddEmployee}"&gt;Add Employee&lt;/a&gt;&lt;/li&gt;
            &lt;/ul&gt;
        &lt;/div&gt;
    &lt;/div&gt;
&lt;/nav&gt;
</code></pre>

<p>And my footer.jsp:</p>

<pre><code>&lt;%@ taglib prefix="spring" uri="http://www.springframework.org/tags" %&gt;
&lt;div class="container"&gt;
    &lt;hr&gt;
    &lt;footer&gt;
        &lt;p&gt;&amp;copy; Something fancy&lt;/p&gt;
    &lt;/footer&gt;
&lt;/div&gt;

&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"&gt;&lt;/script&gt;

&lt;spring:url value="/resources/admin-lte/bootstrap/js/hello.js" var="coreJs" /&gt;
&lt;spring:url value="/resources/admin-lte/bootstrap/js/bootstrap.min.js"
    var="bootstrapJs" /&gt;

&lt;script src="${coreJs}"&gt;&lt;/script&gt;
&lt;script src="${bootstrapJs}"&gt;&lt;/script&gt;
</code></pre>

<p>Thanks in advance for your help.</p>