Jquery Ui Widgets Date Picker Control:
Task 1:Display Html Control using Datepicker control of jQuery?
DatePicker:
Jquery Ui provides a method i.e datepicker() to be applied to an input element type of text to be appear as datepicker ,calendar based control to pick the date for certain fields such as date of birth,eventdate
Syn:$(selector).date
UI design:
<head runat="server">
<title></title>
<link rel="stylesheet" type="text/css" href="themes/jquery-ui-1.11.2/jquery-ui.theme.css" />
<script type="text/javascript" src="Scripts/jquery-2.1.1.js"></script>
<script type="text/javascript" src="Scripts/jquery-ui-1.11.2.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#txt1").datepicker();
});
</script>
<div align="center">
<b>Enter Date of Birth</b>
<input type="text" id="txt1" />
</div>
Task 2:Display Date Of birth Field With Following Options?
<head runat="server">
<title></title>
<link rel="stylesheet" type="text/css" href="themes/jquery-ui-1.11.2/jquery-ui.theme.css" />
<script type="text/javascript" src="Scripts/jquery-2.1.1.js"></script>
<script type="text/javascript" src="Scripts/jquery-ui-1.11.2.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$("#txt1").datepicker();
});
</script>
<div align="center">
<b>Enter Date of Birth</b>
<input type="text" id="txt1" />
</div>
0 comments:
Post a Comment