Sencha

Question

'da bir Handler işlevinin denetimini bir denetleyiciye nasıl yerleştiririm? Ext.window.Window'u oluşturan bir işleyici işlevim var, veri girecek alanlarla birlikte, kodun bu bölümünü bir denetleyici işlevine taşımalıyım ve Ana ajax isteğinden, bu kod yeniden kullanım amaçları içindir.

var win = Ext.create('Ext.window.Window', { 
    title: 'New Client', 
    id: 'addClientWindow', 
    width: 500, 
    height: 300, 
    items: [{ 
     xtype: 'form', 
     bodyPadding: 10, 
     items: [{ 
      xtype: 'fieldset', 
      title: 'My Fields', 
      items: [{ 
       xtype: 'textfield', 
       anchor: '100%', 
       id: 'nameTextField', 
       fieldLabel: 'Name', 

       labelWidth: 140 
      }, { 
       xtype: 'textfield', 
       anchor: '100%', 
       id: 'physicalTextField', 
       fieldLabel: 'Physical Address', 

       labelWidth: 140 
      }, { 
       xtype: 'textfield', 
       anchor: '100%', 
       id: 'postalTextField', 
       fieldLabel: 'Postal Address', 

       labelWidth: 140 
      }] 
     }], 
     dockedItems: [{ 
      xtype: 'toolbar', 
      dock: 'bottom', 
      items: [{ 
       xtype: 'button', 
       id: 'cancelClientBtn', 
       text: 'Cancel', 
       listeners: { 
        click: function(c) { 
         Ext.getCmp('addClientWindow').close(); 
        } 

       } 
      }, { 
       xtype: 'tbspacer', 
       flex: 1 
      }, { 
       xtype: 'button', 
       id: 'saveClientBtn', 
       text: 'Save', 
       listeners: { 
        click: function(c) { 

         Ext.Ajax.request({ 
          url: 'system/index.php', 
          method: 'POST', 
          params: { 
           class: 'Company', 
           method: 'add', 
           data: Ext.encode({ 
            name: Ext.getCmp('nameTextField').getValue(), 
            physical: Ext.getCmp('physicalTextField').getValue(), 
            postal: Ext.getCmp('postalTextField').getValue() 

           }) 
          }, 
          success: function(response) { 
           Ext.MessageBox.alert('Status', 'Record has been updated.'); 
           Ext.getStore('CompanyStore').reload(); 
           Ext.getCmp('addClientWindow').close(); 
          }, 
          failure: function() { 
           Ext.MessageBox.alert('Status', 'Failed to update record.'); 
          } 
         }); 

        } 
       } 
      }] 
     }] 
    }] 
}); 

win.show(); 

düğmesi sadece birbirinden ayrılmış iki gerekir, bu pencere açar ve bu ajax isteği gerçekleştirir. Herhangi bir yardım takdir edildi.

Answer 1

Bir ayrılmış dosyası penceresini tanımlamak ve ona bir takma ad verebilir:

Ext.define('MyApp.view.MyWindow', { 
    extend: 'Ext.window.Window', 
    alias: 'widget.addclient', 
    ... 

    click: function(){ 
     var data = Ext.encode({ 
      name: Ext.getCmp('nameTextField').getValue(), 
      physical: Ext.getCmp('physicalTextField').getValue(), 
      postal: Ext.getCmp('postalTextField').getValue() 
     }); 

     // I assume here "this" links to the window component, 
     // if not, adjust accordingly 
     if(this.mycallback){ 
      this.mycallback(data); 
     } 
    } 

}); 

Sonra diğer denetleyicileri gelen diyoruz ve bir geri arama sağlayabilir: ExtJS sürümü

Ext.define('MyApp.view.MyController', { 
    extend: 'Ext.app.ViewController', 

    requires: 'MyApp.view.MyWindow', 

    openWindow: function(){ 
     var win = Ext.widget('addclient'); 
     win.mycallback = this.onAddClientCallback.bind(this); 
     win.show(); 
    }, 

    onAddClientCallback: function(data){ 
     console.log("data from window", data); 
    } 

});