ExtJS 4: правильно установите waitMsgTarget, используя шаблон MVC - PullRequest
0 голосов
/ 23 сентября 2011

У меня есть контроллер extjs 4.0:

Ext.define('KS.controller.DailyReport', {
extend: 'Ext.app.Controller',

views: ['report.Daily'],


init: function() {
    this.control({
        'dailyReport button[action=send]': {
            click: this.sendDailyReport
        }
    });
},

sendDailyReport: function(button) {
    var win = button.up('window');

    form = win.down('form');
    form.getForm().waitMsgTarget = form.getEl();
    form.getForm().waitMsg = 'Sending...';
    if (form.getForm().isValid()) { // make sure the form contains valid data before submitting
        form.submit({
            success: function(form, action) {
                Ext.Msg.alert('Success', action.result.msg);
            },
            failure: function(form, action) {
                Ext.Msg.alert('Failed', action.result.msg);
            }
        });
    } else { // display error alert if the data is invalid
        Ext.Msg.alert('Invalid Data', 'Correct them!')
    }
}
});

и просмотр extjs:

Ext.define('KS.view.report.Daily', {
extend: 'Ext.window.Window',
alias: 'widget.dailyReport',

title: 'Daily report',
layout: 'fit',
autoShow: true,
initComponent: function() {
    this.items = [{
        waitMsgTarget: true,
        xtype: 'form',
        url: 'dailyReport.php',
        layout: 'fit',
        waitMsgTarget: true,
        waitMsg: 'Sending...',
        items: [{
            margin: 10,
            xtype: 'datefield',
            name: 'reportDate',
            fieldLabel: 'Report for:',
            format: 'd.m.Y.',
            altFormats: 'd.m.Y|d,m,Y|m/d/Y',
            value: '12.12.2011',
            disabledDays: [0]
        }]
    }];

    this.buttons = [{
        text: 'Send',
        action: 'send'
    },
    {
        text: 'Cancel',
        scope: this,
        handler: this.close
    }];

    this.callParent(arguments);
}
});

Как вы видите, я пытался установить waitMsgTarget и waitMsg в обоих местах, но он не появляется, когда я нажимаю кнопку Отправить.

Что не так?

1 Ответ

2 голосов
/ 23 сентября 2011

Вы действительно просто неправильно используете waitMsg следующими способами:

  1. waitMsg не является параметром конфигурации Ext.form.Basic ИЛИ Ext.form.Panel. waitMsg должен быть установлен в пределах вашего Ext.form.action.Submit. Вот почему установка его в представлении никогда не будет работать.
  2. В вашем контроллере вы делаете то же самое и устанавливаете waitMsg, как если бы это было свойство Ext.form.Basic.

Исправить просто. Установите waitMsg в вашем Ext.form.action.Submit. Итак, просто измените строки в form.submit() на что-то вроде:

form.submit({
    waitMsg: 'Sending...',
    success: function(form, action) {
            Ext.Msg.alert('Success', action.result.msg);
        },
    //..... your other stuff here
});

и удалите эти строки из контроллера:

form.getForm().waitMsgTarget = form.getEl();
form.getForm().waitMsg = 'Sending...';

и для полноты удалите эти 2 строки из вида (у вас есть waitMsgTarget там дважды):

waitMsgTarget: true,
waitMsg: 'Sending...',

ПРИМЕЧАНИЕ : Чтобы определить waitMsgTarget для чего-то другого, кроме самой формы, вы должны передать в id цели.

Например, по вашему мнению (то есть определение формы) вы хотели бы изменить waitMsgTarget: true на:

waitMsgTarget: 'myWindowID', 
//where myWindowID is the id of the container you want to mask

Для справки см .: http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.action.Submit и http://docs.sencha.com/ext-js/4-0/#!/api/Ext.form.Basic

...