Date pickers

AUI Date Picker:
To Use AUI we need to import: <%@ taglib uri="http://alloy.liferay.com/tld/aui" prefix="aui"%>
Then add your input field:

<aui:input type="text" name="datepicker" id="datepicker" />

Then add this script:

<aui:script>

AUI().use('aui-datepicker', function(A) {
new A.DatePicker({
trigger : '#<portlet:namespace/>datepicker',
popover : {
zIndex : 1
}
});
});
</aui:script>

Liferay UI DatePicker:
We need to import:

<%@taglib uri="http://liferay.com/tld/ui" prefix="liferay-ui" %>
Then add your input field:

<liferay-ui:input-date formName="dob" yearRangeEnd="2000" yearRangeStart="1950"
yearValue="1990" monthValue="3" dayValue="20" dayParam="d1" monthParam="m1"
yearParam="y1"/>



Jquery DatePicker:
To Use Jquery Date Picker we need to import
<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">

Then add your input field:

<input type = "text" id="datepicker">

Then add this script:
 
 <script>
 $(function() {
 $( "#datepicker" ).datepicker();
 });
 </script>