Optional Datepicker / Manual entry

[tbuyle]

The datepicker is great but some uses like to enter date manually.

Is it possible to make the datepicker optional ? For example, by triggering the picker with a click on a small calendar icon next to the field.

User could then choose between entering the date manually or using the picker.

[tbuyle]

Ok, I found a way to do it with additional JS :

// Activate the picker
$('#exampleInputDatePicker1').pickdate();
// Disable the opening on click and focus 
$('#exampleInputDatePicker1').off("focus");
$('#exampleInputDatePicker1').off("click");
// Remove the readonly attr for the field
$('#exampleInputDatePicker1').removeAttr("readonly")

Now, add a calendar icon, or any other element you want to use to trigger the picker, either directly in your code or inserting it with JS. And bind a click event on it :

$("#PickerOpener").on("click", function(e){
    var picker = $('#exampleInputDatePicker1').pickadate( 'picker' )
    picker.open()
    e.stopPropagation()
  })

e.stopPropagation() is important as it prevents the click to close the picker...

Note that since we removed the readonly attribute for the field, it can be completed manually - Up to you to validate the format when manually entered.

[tbuyle]

I close the issue since it's resolved.

Being able to set the picker as optional could however be a nice feature.