jQuery UI Datepicker with Default Date

Plugin Preview

Share this:

How to start using jQuery?
More jQuery Top, Best and New Plugins
Top 100 jQuery Plugins

Plugin Overview

Plugin:	jquery-ui-built-in-datepicker
Author:	Brendan Skousen
Licence:	MIT Licence
Published:	January 18, 2024
Repository:	Fork on CodePen
Dependencies:	jQuery 1.3.1 or Latest version and jQuery UI
File Type:	zip archive (HTML, CSS & JavaScript)
Package Size:	4 KB

Demo Download

How to Use jQuery UI Datepicker Default Date :

1. To use this simple datepicker, load the jQuery, jQuery UI Js and CSS into HTML document.

<!-- jQuery -->
<script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>

<!-- jQuery UI -->
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>

<!-- jQuery UI CSS -->
<link rel='stylesheet' href='http://ajax.googleapis.com/ajax/libs/jqueryui/1.11.2/themes/smoothness/jquery-ui.css'>
<link rel='stylesheet' href='http://code.jquery.com/ui/1.10.2/themes/smoothness/jquery-ui.css'>

2. After this, create an input element in your form.

<form>
Date:
<input id="datepicker">
</form>

3. Finally, initialize the plugin in anonymous function or in jQuery document ready function.

 $(function() {
$( "#datepicker" ).datepicker();
});

Asif Mughal

I code and create web elements for amazing people around the world. I like work with new people. New people new Experiences.
I truly enjoy what I’m doing, which makes me more passionate about web development and coding. I am always ready to do challenging tasks whether it is about creating a custom CMS from scratch or customizing an existing system.