Schedule next MessageBox to appear

[jlyman]

I'm running into an issue where my app may try to call a new MessageBox.prompt while another one is still disappearing (doing its exit animation). For example, the prompt asks for an input, and if the input is invalid, then the prompt should come up again to get a better value. The first prompt shows up just fine, but the second one never shows up, even though the code is fired.

This worked fine in PR3/4, but now that B1 has reinstated animations it seems to no longer work. Is this due to the singleton nature of MsgBox, or something else? How can one go about getting that second prompt to show up correctly?

[rdougan]

This looks like a bug in beta 1 - sorry about that.

To quickly get around it, you could add a setTimeout() of 500ms inside your callback function and then do whatever you need to do in there.

It's tacky, but it will work until the bug is fixed.

Thanks!

[jlyman]

Gotchya. Thanks for filing the bug, and for the workaround!

I know we don't talk release dates around here, but PR4 was a very short release. Is B1 more like that, or a longer test? Or can you say? ;-)

[rdougan]

We are aiming for a release every week.

[jlyman]

Great news! Thanks Sencha Touch team.

[rdougan]

Here is an override for the issue:

Ext.define('Ext.overrides.messagebox.CallbackIssues', {
    override: 'Ext.MessageBox',

    // pass `fn` config to show method instead
    onClick: function(button) {
        if (button) {
            var config = button.config.userConfig || {},
                initialConfig = button.getInitialConfig(),
                prompt = this.getPrompt();

            if (typeof config.fn == 'function') {
                this.on({
                    hiddenchange: function() {
                        config.fn.call(
                            config.scope || null,
                            initialConfig.itemId || initialConfig.text,
                            prompt ? prompt.getValue() : null,
                            config
                        );
                    },
                    single: true,
                    scope: this
                });
            }

            if (config.cls) {
                    this.el.removeCls(config.cls);
                }

            if (config.input) {
                config.input.dom.blur();
            }
        }

        this.hide();
    }
});