jQuery Date Formatter

Sometimes you need to create date input field but not restrict user to enter in a particular format. Yes it’s now possible with the help of this jquery plugin. This plugin let user’s to input their date in any kind of form and when user blur the field it automatically convert date into admin’s desired format. Let’s take an example, suppose user input date like 31/12/2015 or 12/31/2015 or 2015/31/12 or 2015/12/31 or 31-12-2015 or 12-31-2015 or 2015-12-31 etc., this program will convert all of them into 12/31/2015 (as admin set it to mm/dd/yyyy format).

The Date Formatter is a wrapper for the DateFormatter jQuery Plugin by Alauddin Ansari.
It allows a user to more easily enter any form of date and it’ll converted into correct format.

 

Demo:

Type date and click outside to see the actual date

Code

Download – dateformatter.js

<!DOCTYPE html>
<html>
<head>
    <title>Date Formatter - jQuery Plugin</title>
    <script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
    <script src="dateformatter.js"></script>
</head>
<body>
    <input type="text" name="d1" id="d1" /><br><br>
    <input type="text" name="d2" id="d2" />

    <script type="text/javascript">
    $(function(){
        $('#d1, #d2').dateformatter({
            placeholder:'mm/dd/yyyy',
            allowTimestamp: false,
        });
    });
    </script>
</body>
</html>

 

Fork on Github

https://github.com/AlauddinTheWonder/jQuery-DateFormatter

Download Source Code

 

01. February 2015 by Alauddin Ansari Javascript, jQuery 1 comment 2,135 views Tags: , , ,

One Comment

  1. You’re website loads great even from my iPad. Thanks for the helpful info.

Leave a Reply