jquery date time picker

Question

could any body tell how to use Jquery calendar date time picker.

Answer 1

See:

http://jqueryui.com/demos/datepicker/

There is also the documentation with those demos.

Answer 2

For the default options, it's simply

$(function() {  // function to execute when DOM is ready
    $('#input').datepicker(); // run datepicker on jQuery object
});

where you have

<input type="text" id="input" />

in your markup. You'll need to reference the scripts in the following order

1. jQuery script
2. datepicker script
3. Your script binding the datepicker on DOM ready.

for a more advanced example, check out this demo. add /edit to the URL if you'd like to see the code behind it.

Answer 3

You do the following:

1. Download the jQuery UI datepicker, which requires the UI core.
2. Add the script reference to your page, and CSS for the theme
3. Add the code to bind a datepicker to a textbox, as follows:

You can read the documentation here: http://jqueryui.com/demos/datepicker/

<input id="datepicker" type="text">
<script type="text/javascript">
    $(function() {
        $("#datepicker").datepicker();
    });
</script>

Answer 4

You might also consider a native HTML5 datepicker. User Modernizr to decide whether to use browser native or not.