I did the following to make the formatter work for both selected date from calendar, and user entered input and also apply validation for both
onHidePanel:function(){
$(this).datebox('setValue', validateDate($(this).datebox('getValue')));
}
function validateDate(value){
if (!value){
return;
}
var date;
var ss = (value.split('/'));
var m = parseInt(ss[0],10);
var d = parseInt(ss[1],10);
var y = parseInt(ss[2],10);
y = parseInt('2000'.substr(0, 4-String(y).length)+y);
if (!isNaN(y) && !isNaN(m) && !isNaN(d)){
date = new Date(y,m-1,d);
} else {
return;
}
if(isNaN(date.getFullYear())){
return;
}
var s = dateFormatter(date);
return s;
}
function dateFormatter(date){
var y = date.getFullYear();
y = parseInt('2000'.substr(0, 4-String(y).length)+y);
var m = date.getMonth()+1;
var d = date.getDate();
return (m<10?('0'+m):m) + '/' + (d<10?('0'+d):d) + '/' + y;
}
Please feel free to write your comments.