ExtJS 3.x DateField menuListeners show/hide

Question

I'm trying to call some functions whenever the show/hide events happen on my DateField. I believe these should fire when the menu widget opens and closes. So far, I haven't been able to get my test alert() methods to appear.

<body>
<div id="dateField"></div>
<script type="text/javascript">
    Ext.onReady(function() {

        var dField = new Ext.form.DateField({
            format: 'M d, Y',
            fieldLabel: 'Date',
            allowBlank:false,
            disabledDays:  [0, 6],
            enableKeyEvents :true,
            forceSelection: true,
            menuListeners: {
                hide:{fn:function() {
                    alert("Bye");
                }},
                show:{fn:function() {
                    alert("Hi");
                }}
            },
            listeners:{
                select:{fn:function(combo, value) {
                    alert("select");
                }}
            }
        });
        dField.render('dateField');
    });
</script>
</body>

Abdel Raoof Olakara Abdel Raoof Olakara · Accepted Answer · 2011-05-14T06:03:42

menuListeners? I am not aware of such a property. In ExtJS all event methods go into listeners.

listeners:{
    select: function(combo, value) {
        alert("select");
    },
    hide: function(comp) {
        alert('Bye');
    },
    show: function(comp) {
        alert('Hi');
    }
}

Now, you hide and show methods will be called accordingly.

ExtJS 3.x DateField menuListeners show/hide

1 Answers