Question

我正在创建一个报告制作工具。我将在面板容器内拖动/调整面板大小。当我单击保存按钮时，我将传递面板的大小和位置，并基于此生成xhtml报告。我在左侧有一个数据视图。每次生成报告时，我都需要在数据视图上显示该报告。不使用任何数据库如何做到这一点？任何帮助将不胜感激。

Answer 1

做一件事，创建一个包含“size”，“report_data”和“position”字段的商店。

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
});

每当您生成新报告时，请创建一个新的Ext.Record：

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);

这是你想要的吗？但是，此代码未在任何地方进行测试。

extjs dataview问题

1 个答案: