Friday 4 July 2014

Jquery Datepicker for web application


Hi friends ,

This article is about how to all user jquery Datepicker in your web application.

Consider following example

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.0/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.0/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">

 <script type="text/javascript">
        $(document).ready(function () {
            $("#textbox1").datepicker({
             
                changeMonth: true,
                changeYear: true,
                yearRange: "-100:+0",
                dateFormat:"dd/mm/yy",
               altFormat: "mm/dd/yy",
               altField: "#hiddenfield1",
               defaultDate: '18/01/1990'

            });

        });
</script>
---------------------------------------------------------------------------------------------
In above example "textbox1" is id of textbox to which you want to apply datepicker.

changeMonth: allows to select monthfrom  dropdown
changeYear:   allows to select year from  dropdown .
dateformat:  format of date in which you want date.
altFormat:  alternate format of date.
altField:     alternate field to which alternate date will be assigned.
defaultDate:  default date selected in datepicker

Note: Remember the links included at top is necessary to get datepicker.
for more details visit  http://jqueryui.com/datepicker/

-----------------------------------------------------------------------------------------

output:

--------------------------------------------------------------------------------------------
Enjoy Scripting..


No comments:

Post a Comment