datapicker write something different in date field

Question

I want to use Zebra datapicker... but if I attach it to the input, I can't write somethig different from data which is picked in calendar... so how I can choose what I can write into textbox...

P.S I am using only one textbox in my page

Answer 1

Whilst I'm not familiar with the date picker you mention, it ought to have some means of specifying a callback function that acts as an intermediary between the selected value and what, ultimately, gets put in the text field.

I wrote a date picker some years ago which does this - see the callback_func param.

Without a callback, it inserts the selected date into the field. With a callback, it passes the selected date to the callback and uses the function's return value to decide the new value for the field.

var cal = new Calendar({
    callback_field: '#myField', 
    focusElements: '#myField',
    callback_func: function(d, m, y, date) { return 'hijack!'; }
});

Answer 2

You need to use a plugin that validates your keyup event on the text field.

Here's a small piece of code I wrote that does just that: https://github.com/cassilup/jquery.keyup.validator

Unfortunately, it does not have code for date, but you tweak it freely to suit your needs.

---

Alternatively, you could assign the text field as readonly and let the datepicker do the date input.