comment réinitialiser EXT datefield

Question

J'ai utilisé deux champs de date comme date de début et de fin pour sélectionner la plage de dates. Rendez ces champs de date dans deux div séparés. problème est que lorsque je presse champs de date bouton reset obtenir reset mais le composant de calendrier ne sont pas remis à zéro et désactiver encore toutes les dates en dehors de la plage de dates qui a été sélectionnée jusqu'à ce que je rafraîchir la page:

ici est un html

<table cellspacing="6" align="center" border="0">   
<tr> 
    <td><b>Report Period:</b> </td> 
<td><div id="fromDateRange"></div></td>   
<td><div id="toDateRange"></div></td> 
<td><input type="button" value="Search"/></td> 
<td><input type="reset" value="Reset"/></td> 
</tr> 
</table> 

ici Code poste

var drSt = new Ext.Panel({ 
labelWidth: 30, 
border: false, 
width: 100, 
layout: 'fit', 
defaults: {width: 125}, 
defaultType: 'datefield', 
items: [{ 
name: 'startdt', 
id: 'startdt', 
vtype: 'daterange', 
format: 'Y-m-d', 
endDateField: 'enddt' // id of the end date field 
}] 
}); 

drSt.render('fromDateRange'); 

var drET = new Ext.Panel({ 
    labelWidth: 30, 
    border: false, 
    width: 100, 
    layout: 'fit',   
    defaults: {width: 125}, 
    defaultType: 'datefield', 
    items: [{ 
     name: 'enddt', 
     id: 'enddt',  
     vtype: 'daterange', 
     format: 'Y-m-d', 
     startDateField: 'startdt' // id of the start date field 
    }] 
    }); 

drET.render('toDateRange'); 

Answer 1

ajouter un écouteur à votre champ de date. utiliser un écouteur select n'est pas un écouteur de modification, car l'événement de changement se déclenche uniquement sur le flou. ou vous pouvez le faire

dateFrom.addValueChangeHandler(new ValueChangeHandler<Date>() { 
    @Override 
    public void onValueChange(ValueChangeEvent<Date> event) { 
     ... 
    } 
}); 

pour effacer vous pouvez utiliser quelque chose comme ça - fourchette à vos besoins

{ 
    xtype: 'datefield', 
    onTriggerClick: function() { 
     Ext.form.DateField.prototype.onTriggerClick.apply(this, arguments); 
     var btn = new Ext.Button({ 
      text: 'Clear' 
     }); 
     btn.render(this.menu.picker.todayBtn.container); 
    } 
} 

source