0

If I click the textbox that comes with the file field and move the mouse away, onblur event is fired. How do i ensure the blur event is still fired when i click on the browse button and move the cursor away, without clicking the filefield textbox? my code snippet is below:

 {
                xtype: 'filefield',
                emptyText: 'Select file... (pdf, word, excel)',
                id: 'offer_file',
                name: 'offer_file',
                width: 400,
                buttonText: '',
                allowBlank: false,
                margins: '0 0 5 5',
                buttonConfig: {
                    iconCls: 'upload-icon'
                },
                listeners: {
                    blur: function(obj) {
                        console.log('Filefield Blurred');
                    }
                }

 }
nixxx
  • 423
  • 1
  • 9
  • 23

1 Answers1

1

Try the following approach, not the best but still works:

Ext.create('Ext.form.Panel', {
    title: 'Upload a Photo',
    width: 600,
    bodyPadding: 10,
    frame: true,
    renderTo: Ext.getBody(),
    items: [{
        xtype: 'filefield',
        emptyText: 'Select file... (pdf, word, excel)',
        id: 'offer_file',
        name: 'offer_file',
        width: 400,
        buttonText: '',
        allowBlank: false,
        margins: '0 0 5 5',
        listeners: {
            render: function() {
                this.fileInputEl.on('blur', function() { 
                    Ext.Msg.alert('Alert', 'Filefield Blurred');
                });
            }
        }
    }]
});
Baidaly
  • 1,829
  • 1
  • 15
  • 16
  • sorry daulet urazalinov. I meant how do i ensure the blur event is still fired when i click on the browse button and move the cursor away, without clicking the filefield textbox. question edited. – nixxx Jul 24 '14 at 06:54
  • Sorry, didn't get your question. What sequence of events do you expect and for what? You can this fiddle: https://fiddle.sencha.com/#fiddle/80f – Baidaly Jul 25 '14 at 14:56
  • i want a scenario where after i click the browse button to select a file and move the cursor away from the button(blue button in you fiddle sample), the blur event is fired on the filefield. The same way it is doing for the file textbox. – nixxx Jul 26 '14 at 11:45