Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jQuery Date Picker where text input is read only

I want to use the Jquery datepicker. I've got it setup using an the alt field option. I'm displaying D/M/Y in the text field, but submitting Y-M-D. Everything works fine so far, sending the correct data, etc.

However I want to stop the user from being able to manually type a date. I had originally set the INPUT field to disabled, which worked in every browser except IE. In IE it would popup the date picker but then not close after clicking a date.

Does anyone know the best way to do this?

like image 321
Rowan Parker Avatar asked May 05 '10 06:05

Rowan Parker


People also ask

How do I make a date picker read-only?

$("#datepicker"). attr('readonly', 'readonly');

How do you make a DatePicker not editable?

readOnly={true} disables DatePicker instead of preventing edit (and keyboard appearing on mobiles) #1480.

How do I make DatePicker textbox editable?

1 Answer. Show activity on this post. $('#start_date'). datetimepicker({timeFormat: "HH:mm:ss", dateFormat:"dd-mm-yy", constrainInput: false, maxDate: maxdate});


1 Answers

To prevent the user from manually editing the input, I would attach a keypress event and return false / prevent default from it's handler. This way if he has javascript he can use the datepicker, and if not he can manually edit the input.

$("#input-id").keypress(function (e)
{
    e.preventDefault();
});
like image 78
nc3b Avatar answered Oct 13 '22 10:10

nc3b