reset rich:calendar value on jsf form using java script

Question

I am trying to reset value of rich:calender input box via java script but couldnt do it any way at all. the UI of my form (snippet only) is...

 <rich:calendar id="startDate" datePattern="dd MMM yyyy"                    value="#{classBean.startDate}" popup="true" onchanged="calcDuration();">
 </rich:calendar>

the java script is

    function calcDuration()
{
sdate =$('frm_course:startDate').component.getSelectedDateString("dd MMM 
   yyyy");
   var currentdate = new Date();
   var sdatecmp = new Date(sdate);          

   if(sdatecmp > currentdate)
{
 alert('The Start Date is Greater than today!');
$('frm_viewCourseDetail:startDate').component.value = ""; // 1
     document.getElementById('frm_course:startDate').value =""; // 2     
}
  }        

None of the lines 1 and 2 resets the richcalender's value. Help is required here. thanks.

Answer 1

The calendar (and other components) is backed by a JavaScript object which has the methods you need.

Use either #{rich:component('startDate')} or RichFaces.$('startDate') to get a reference to that object and then call resetValue() .

For other methods check the docs