Start Building Professional
Web Apps Today

Changing date to empty with Calendar attached to an input

I have a calender attached with input. Calender wasn't working properly with editable textfield so I made input field read-only. But with this, how can a user change date to empty. I can do it programmatically but what if user sets a date and then decides to clear it out?
<input id="question_#{question.id}" class="css1" readonly="true">

<script>
add_calendar_#{question.id} = function() {
cal_#{question.id} = new dhtmlxCalendarObject('question_#{question.id}',false,{isYearEditable :true,isMonthEditable :true});
cal_#{question.id}.setDateFormat('%m/%d/%Y');
cal_#{question.id}.setSkin('yahoolike')
cal_#{question.id}.draw();
dhtmlxEvent(document.body,"click",function(){ cal_#{question.id}.hide(); }); //hide calendar onclick
dhtmlxEvent(cal_#{question.id}.con,"click",function(e){ (e||event).cancelBubble=true; }); //block click events inside calendar object
dhtmlxEvent(cal_#{question.id}.entObj,"click",function(e){ (e||event).cancelBubble=true; }); //block click events inside calendar object

}
Event.observe(window, 'load', add_calendar_#{question.id});
</script>