datepicker using jquery in asp.net

Their are manny ways

1) Use jquery - refer

http://jqueryui.com/datepicker/

2) Refer code

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript">script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
type="text/javascript">script>
<link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="Stylesheet" type="text/css" />
<script type="text/javascript">
$(function () {
$("[id$=txtDate]").datepicker({
showOn: 'button',
buttonImageOnly: true,
buttonImage: 'https://jqueryui.com/resources/demos/datepicker/images/calendar.gif'
});
});
script>
head>
<body>
<form id="form1" runat="server">
<input name="txtDate" type="text" readonly="readonly" id="txtDate" />
<input type="submit" name="btnSubmit" value="Submit" id="btnSubmit" />
form>
body>
html>

3) Refer code

<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title>title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript">script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
type="text/javascript">script>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
rel="Stylesheet" type="text/css" />
<script type="text/javascript">
$(function () {
$("[id$=txtDate]").datepicker({
showOn: 'button',
buttonImageOnly: true,
buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif'
});
});
script>
head>
<body>
<form id="form1" runat="server">
<input name="txtDate" type="text" readonly="readonly" id="txtDate" />
<input type="submit" name="btnSubmit" value="Submit" id="btnSubmit" />
form>
body>
html>

4) Use AJAX control Toolkit

http://www.c-sharpcorner.com/UploadFile/2f59d0/use-ajaxcontroltoolkit-calendar-extender-with-Asp-Net/

5) https://www.aspsnippets.com/Articles/ASPNet-AJAX-CalendarExtender-with-ImageButton-Example.aspx

2 Replies

Know the answer? Post it — somebody with the same question will find it here.

Rupesh Kahane8y ago
Their are manny ways
1) Use jquery - refer
http://jqueryui.com/datepicker/
2) Refer code
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript">script>
    <script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
        type="text/javascript">script>
    <link href="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
        rel="Stylesheet" type="text/css" />
    <script type="text/javascript">
        $(function () {
            $("[id$=txtDate]").datepicker({
                showOn: 'button',
                buttonImageOnly: true,
                buttonImage: 'https://jqueryui.com/resources/demos/datepicker/images/calendar.gif'
            });
        });
    script>
head>
<body>
    <form id="form1" runat="server">
    <input name="txtDate" type="text" readonly="readonly" id="txtDate" />
    <input type="submit" name="btnSubmit" value="Submit" id="btnSubmit" />
    form>
body>
html>
3) Refer code
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
    <title>title>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6/jquery.min.js" type="text/javascript">script>
    <script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"
        type="text/javascript">script>
    <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css"
        rel="Stylesheet" type="text/css" />
    <script type="text/javascript">
        $(function () {
            $("[id$=txtDate]").datepicker({
                showOn: 'button',
                buttonImageOnly: true,
                buttonImage: 'http://jqueryui.com/resources/demos/datepicker/images/calendar.gif'
            });
        });
    script>
head>
<body>
    <form id="form1" runat="server">
    <input name="txtDate" type="text" readonly="readonly" id="txtDate" />
    <input type="submit" name="btnSubmit" value="Submit" id="btnSubmit" />
    form>
body>
html>
4) Use AJAX control Toolkit
http://www.c-sharpcorner.com/UploadFile/2f59d0/use-ajaxcontroltoolkit-calendar-extender-with-Asp-Net/

5) https://www.aspsnippets.com/Articles/ASPNet-AJAX-CalendarExtender-with-ImageButton-Example.aspx
+1
Srikant Maruwada8y ago
Hi

Please refer below article

http://www.c-sharpcorner.com/UploadFile/2f59d0/use-jquery-datepicker-in-Asp-Net-webform/
+1