Question

我想要完成的是将信息添加到数据网格，然后我有一个按钮'添加'，当我点击它时，它将显示一个面板，我可以在其中添加填充数据网格所需的所有信息。

添加信息的面板应如下所示：

http://img94.imageshack.us/img94/2662/emailhelp.jpg

上面的一个我用这样的消息框完成了它：

     Ext.MessageBox.show({
        title : 'Email Information',
        msg : 'your email:',
        width : 300,
        buttons : Ext.MessageBox.OKCANCEL,
        multiline : true,
        fn : addEmailInfo,
        animateTarget : 'btn_add'
    });

然后我想要的是类似的东西，但有一个面板，我可以在其中添加更多的组件。

我一直在寻找，但我找不到任何东西，谢谢你。

Answer 1

我看过，但是没有预定义的ExtJS方法在表单面板中打开网格行（应该是）。

ExtJS网格有一个内嵌行编辑扩展，效果非常好。 Just double click a grid row and the record opens editable fields for any data you set as editable。有关实施它的更多细节是here。

如果这不适合您，则必须创建一个新的Ext.window并将自己的表单面板/字段添加到其中。

在网格中创建一个onclick侦听器

使用选定的记录数据和
显示窗口（myWindow.show()）。

您还必须编写一种方法，将已编辑或新创建的记录保存到数据存储区（使用myDataStore.set([field],[value])），并将一行提交到数据库（如果这是您获取数据的位置）。

为了更准确地回答您的问题，您可以添加其他字段的新窗口可以这样做：

myWindow = Ext.create('Ext.window.Window', {
    id: 'recordWindow',
    title: 'New Particle',
    resizable: false,
    closable: false,
    width: 605,
    minWidth: 300,
    minHeight: 200,
    y: 150,
    layout: 'fit',
    plain:true,
    items: myFormPanel, //your form or fields would go here
    buttons: [{
        text: 'Save',
        handler: saveRecord()
    },{
        text: 'Cancel',
        handler: resetRecordWindow()
    }]
});

Answer 2

这个例子怎么样？它显示了一个网格，右侧有一个编辑表单。如果您不喜欢这样，那么您可以像Geronimo建议的那样将表单包装到窗口组件中。 http://docs.sencha.com/ext-js/4-0/#!/example/form/form-grid.html

EXTJS 4渲染面板，如消息框

2 个答案: