Sencha X模板問題來自控制器調用

我對XTemplates和使用MVC結構有一些困難。我已經閱讀了一些教程，並且他們自己有意義，但是當我嘗試將它們應用於我正在嘗試完成的內容時，它並不能很好地工作。Sencha X模板問題來自控制器調用

首先，我的應用程序由TabBarMVC和幾個視圖組成。一些意見將有'子觀點'。我從「佈局」角度開發應用程序。製表符是標籤，視圖可以訪問子視圖。現在問題是發送數據到子視圖。

一個例子是我的Bill頁面到Detail頁面。在賬單頁面中，用戶可以輸入總數和人數來分割賬單。我的控制器接受兩個參數並將它們分開並將它們存儲在「賓客」對象中。我的賓客對象將是1-x個訪客對象的數組。（根據要分割的數量）。

然後，我將該對象發送到我的子視圖中的更新方法來更新XTemplate，但沒有發生。我可以提醒對象，並在調試器中查看數據，但我不知道如何更新Xtemplate。

這裏是控制器代碼：

splitdetail: function(options) 
{ 
    if (! this.splitdetailView) 
    { 
     var totalBill = options.data['totalBill']; 
     var numGuests = options.data['splitBy']; 

     var totalPerGuest = totalBill/numGuests; 

     var guestObject = new Array(); 
     var theGuest; 
     for (var i=0; i<numGuests; i++) { 
      theGuest = {amount: totalPerGuest} 
      guestObject.push(theGuest); 
     } 

     app.views.calculatorSplitDetail.updateWithRecord(guestObject); 

     this.splitdetailView = this.render({ 
      xtype: 'CalculatorSplitDetail', 
      switchAnimation: { type: 'slide'} 
     }); 
    } 

    this.application.viewport.setActiveItem(this.splitdetailView, 'slide'); 
},

，這裏是我的拆分細節

var guestTemplate = new Ext.XTemplate(
'<tpl for=".">', 
    '<div class=" x-field guest-amount-row x-field-number x-label-align-left">', 
     '<div class="x-form-label" style="width: 30%; ">', 
      '<span>Total bill</span>', 
     '</div>', 
     '<div class="x-form-field-container">', 
      '<input type="number" name="totalGuestAmount" class="x-input-number" value="{amount}">', 
     '</div>', 
    '</div>', 
'</tpl>' 
); 


app.views.CalculatorSplitDetail = Ext.extend(Ext.form.FormPanel, { 
    initComponent: function() { 

    Ext.apply(this, { 
     scroll: false, 
     items: [ 
      guestTemplate, 
      ] 

    }); 

    app.views.CalculatorSplitDetail.superclass.initComponent.call(this); 

}, 

styleHtmlContent: true, 
baseCls: 'calculator-splitdetail-panel', 

updateWithRecord: function(record) { 

    guestTemplate.apply(record); 
    alert(record[0].amount);  
} 
}); 

Ext.reg('CalculatorSplitDetail', app.views.CalculatorSplitDetail);

來源

2011-10-24 jdruid

guestTemplate只是一個模板，而不是控制，所以它不能自動刷新，但它可以爲你生成新的html。所以你所要做的就是用新生成的html更新你的面板：

updateWithRecord: function(record) { 
    this.update(guestTemplate.apply(record)); 
    alert(record[0].amount);  
}

來源

2011-10-26 22:08:01

謝謝。我會嘗試。 – jdruid

Sencha X模板問題來自控制器調用

回答

相關問題