HTML Code with Jquery
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Test2.aspx.cs" Inherits="MySchool.Test2" %>
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<link href="TempS/jquery-ui.css" rel="stylesheet" />
<script src="TempS/jquery-1.10.2.js"></script>
<script src="TempS/jquery-ui.js"></script>
<script>
$(function () {
$("#datepicker").datepicker({
dateFormat: "dd/M/yy",
changeMonth: true,
changeYear: true
}).on('change', function () {
var mydate = $("#datepicker").val();
var d, m, y;
d = mydate.substring(0, 2);
m = mydate.substring(3, mydate.lastIndexOf('/'));
y = mydate.substring(mydate.lastIndexOf('/') + 1, mydate.length);
var monthNamesShort = $("#datepicker").datepicker("option", "monthNamesShort");
var mName = monthNamesShort[parseInt(m) - 1];
if (mName != undefined) {
mydate = d + "/" + mName + "/" + y;
//alert(mydate);
$("#datepicker").datepicker("setDate", mydate);
}
else if (monthNamesShort.indexOf(m) < 0) {
$("#datepicker").datepicker("setDate", new Date());
}
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<p>
Date:
<input type="text" id="datepicker" size="30" maxlength="11" />
</p>
</div>
</form>
</body>
</html>
Other Jquery Datepicker with Image button
$(function () {$("#datepicker").datepicker({
changeMonth: true,
changeYear: true,
showOn: "button",
buttonImage: "images/calendar.gif",
buttonImageOnly: true,
defaultDate:new Date(),
dateFormat:'dd/M/yy',
navigationAsDateFormat:true
}).datepicker("setDate", "20/Oct/2013");
});