Form submission in ExtJs 6

Question

I have a form, that I submit with success and failure callbacks:

The view:

Ext.define('App.view.CommentForm', {
    extend: 'Ext.form.Panel',
    alias: 'widget.ship-commentForm',
    url: 'addcomment.php',
    items: [{
        xtype: 'textarea',
        fieldLabel: 'Comment',
        name: 'text',
        allowBlank: false,
        maxLength: 1000
    },{
        xtype: 'textfield',
        fieldLabel: 'User name',
        name: 'username',
        readOnly: true
    }],
    fbar: [{
        text: 'Save',
        formBind: true,
        itemId: 'submit'
    }]
})

And the controller:

Ext.define('App.controller.MyController', {
    init: function(){
        this.control({
            'ship-commentForm button#submit': {click: this.onFormSubmit},
...
    onFormSubmit: function(btn){ 
        var form = btn.up('form').getForm(),
        me = this,
        values = form.getValues();
        form.submit({
            success: function(form, action){
                console.log('success')
            },
            failure: function(form, action){
                console.log('failure')
            }
        })
        setTimeout(function(){btn.up('window').close()}, 100)
    },

While this worked great in ExtJs4, in ExtJs6, the form submits as it should, but the success and failure callbacks are no longer called. This should still work according to the documentation of submit().

N.B. The server responds contains a valid JSON string:

{"success":true,"msg":"Comment saved"}

Edit: I just added the code in the controller that I suspect being the issue: setTimeout(btn.up('window').close(), 100)

Answer 1

Instead of closing your window with a setTimeout, make it in your success callback of the form.submit(). It should solve your problem.

form.submit({
    success: function(form, action){
        btn.up('window').close()
    },
    failure: function(form, action){
        console.log('failure')
    }
})