Jquery datepicker to Input normal text and Date

Question

How can I use the jquery datepicker to input date from an icon and also to take random text from keyboard.

For example
I need a text box to take Exact date (26-10-2015) and also text like since 3 years.

Thanks in advance.

Answer 1

You could just use a hidden input as datepicker with this kind of logic eg:

 $(function() { $(".date").datepicker({ dateFormat: 'dd/mm/yy', showOn: "button", buttonImage: "https://htmlcssphptutorial.files.wordpress.com/2015/09/b_calendar.png", buttonImageOnly: true, buttonText: "Select date", onSelect: function(dateText) { $(this).prev().val(dateText); } }); $('input + .date').prev().on('change', function() { var dateStr = this.value.split(/[\\/-]/); $(this).next().datepicker("setDate", new Date(dateStr[2], dateStr[1] - 1, dateStr[0]) ); }) }); 

 .date { display: none; } 

 <link href="https://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css" rel="stylesheet"/> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="https://code.jquery.com/ui/1.11.4/jquery-ui.js"></script> <input placeholder="Any text there" /> <input type="text" name="date" class="date" readonly />