ExtJS的數據視圖問題

Question

我創建報表製作工具。我將在面板容器內拖動/調整面板大小。當我點擊保存按鈕時，我傳遞了面板的大小和位置，並基於此生成一個xhtml報告。我在左邊有一個數據視圖。每次生成報告時，我都需要在dataview上顯示該報告。不使用任何數據庫如何做到這一點？任何幫助，將不勝感激。

Answer 1

做一兩件事，創建一個存儲與領域「大小」，「report_data」和「位置」。

var store = new Ext.data.JsonStore({ 
    id : 'panel_store', 
    fields : ['size', 'position', 'report_data'] 
}); 

爲每個報告模板（一些其他的數據都可以在這裏添加）：

var template = new Ext.XTemplate(
    '<div class="reports_container"><tpl for=".">', 
    '<div class="report">{report_data}</div>','</tpl></div>' 
); 

template.compile(); 

創建模板和存儲數據視圖：

var dataView = new Ext.DataView({ 
    itemSelector : 'div.report', // Required 
    style : 'overflow:auto', 
    multiSelect : true, 
    store : store, 
    tpl : template 
}); 

添加數據視圖中你主面板：

var mainPanel = new Ext.Panel({ 
    id : 'main_panel', 
    items : dataView 
}); 

當你生成一個新的報告，創建一個新的擴展記錄：

var ReportRecord = Ext.data.Record.create([ 
    { name: 'size' }, 
    { name: 'position' }, 
    { name: 'record_type' } 
]); 

var newRec = new ReportRecord({ 
    size : '100', 
    position : 'some position', 
    report_data : 'some data' 
}); 

store.add(newRec); 

store.on('add', function() { 
    dataView.refresh(); 
}, this); 

這是你想要的嗎？但是，此代碼未在任何地方進行測試。