https://www.youtube.com/watch?v=C8oykuBC0HA&t=2s
Today i gonna show you, how to use Jquery based date picker control with various date formats as per your requirement, Below is working Code sample, hope this will helpful to you.
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta charset="utf-8" />
<title>jQuery UI Datepicker - Default functionality</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css" />
<script>
$(function () {
$("#datepicker1").datepicker({ dateFormat: 'dd M yy' }).val();
$("#datepicker2").datepicker({ dateFormat: 'dd MM yy' }).val();
$("#datepicker3").datepicker({ dateFormat: 'd M y' }).val();
$("#datepicker4").datepicker({ dateFormat: 'dd M y' }).val();
$("#datepicker5").datepicker({ dateFormat: 'dd MM y' }).val();
$("#datepicker6").datepicker({ dateFormat: 'M dd yy' }).val();
$("#datepicker7").datepicker({ dateFormat: 'MM dd yy' }).val();
$("#datepicker8").datepicker({ dateFormat: 'M d y' }).val();
$("#datepicker9").datepicker({ dateFormat: 'M dd y' }).val();
$("#datepicker10").datepicker({ dateFormat: 'MM dd y' }).val();
$("#datepicker11").datepicker({ dateFormat: 'yy dd M' }).val();
$("#datepicker12").datepicker({ dateFormat: 'yy dd MM' }).val();
$("#datepicker13").datepicker({ dateFormat: 'y d M' }).val();
$("#datepicker14").datepicker({ dateFormat: 'y dd M' }).val();
$("#datepicker15").datepicker({ dateFormat: 'y dd MM' }).val();
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<p><b>Below are the various mainly used date formates to display.</b><br /></p>
<p><b>All Formates with date in front:</b></p>
<p>DateFormat1:<asp:TextBox ID="datepicker1" runat="server"></asp:TextBox></p>
<p>DateFormat2:<asp:TextBox ID="datepicker2" runat="server"></asp:TextBox></p>
<p>DateFormat3:<asp:TextBox ID="datepicker3" runat="server"></asp:TextBox></p>
<p>DateFormat4:<asp:TextBox ID="datepicker4" runat="server"></asp:TextBox></p>
<p>DateFormat5:<asp:TextBox ID="datepicker5" runat="server"></asp:TextBox></p>
<p><b>All Formates with Month in front:</b></p>
<p>DateFormat6:<asp:TextBox ID="datepicker6" runat="server"></asp:TextBox></p>
<p>DateFormat7:<asp:TextBox ID="datepicker7" runat="server"></asp:TextBox></p>
<p>DateFormat8:<asp:TextBox ID="datepicker8" runat="server"></asp:TextBox></p>
<p>DateFormat9:<asp:TextBox ID="datepicker9" runat="server"></asp:TextBox></p>
<p>DateFormat10:<asp:TextBox ID="datepicker10" runat="server"></asp:TextBox></p>
<p><b>All Formates with year in front:</b></p>
<p>DateFormat11:<asp:TextBox ID="datepicker11" runat="server"></asp:TextBox></p>
<p>DateFormat12:<asp:TextBox ID="datepicker12" runat="server"></asp:TextBox></p>
<p>DateFormat13:<asp:TextBox ID="datepicker13" runat="server"></asp:TextBox></p>
<p>DateFormat14:<asp:TextBox ID="datepicker14" runat="server"></asp:TextBox></p>
<p>DateFormat15:<asp:TextBox ID="datepicker15" runat="server"></asp:TextBox></p>
</div>
</form>
</body>
</html>
https://www.youtube.com/watch?v=C8oykuBC0HA&t=2s
ReplyDelete