Question

我有一个带有表单面板的extjs弹出窗口，我想知道如何将表单面板中的数据发送到我的弹簧控制器？

var formPanel =  {
    xtype       : 'form',
    height      : 125,
    autoScroll  : true,
    id          : 'formpanel',
    defaultType : 'field',
    frame       : true,
    items       : [
        {
            fieldLabel : 'Name'
        },
        {
            fieldLabel : 'Age'
        }
    ]
};

function openIFrame() {
 Ext.create('Ext.window.Window', {
    title : 'Import your devices',
    width: 500,
    height: 500,
    layout: 'fit',
    items: [formPanel]
}).show();

}

Answer 1

通过控制器中的某个选择器获取表单，然后调用getForm().getValues()方法。方法返回由表单字段及其值创建的对象。

然后您可以使用Ext.Ajax.request方法将此对象发送到服务器（文档：http://docs.sencha.com/extjs/4.2.2/#!/api/Ext.Ajax-method-request）

Answer 2

您可以通过以下代码向params服务器发送请求：

 Ext.Ajax.request({
    url: '/requestUrl',
    params: {
        param1: data1,
        param2: data2
    },
    method: 'POST',
    success: function(response) {
        //do something...
        }
    })

此外，您需要将此代码添加到弹出窗口中的某个侦听器，例如onButtonClick

function openIFrame() {
 Ext.create('Ext.window.Window', {
    title : 'Import your devices',
    width: 500,
    height: 500,
    layout: 'fit',
    items: [formPanel],
    buttons: [
                {
                    text: 'Submit',
                    handler: function () {
                       //function which listed above 
                    }
                }

            ]
}).show();

要在BE处理请求，您需要创建这样的控制器：

@ResponseBody
@RequestMapping(value = "/requestUrl")
public void handler(@RequestParam ("param1") String param1,
                        @RequestParam ("param2") String param2) throws Exception {
      //do something with data
}

将数据从extjs弹出窗口发送到弹簧控制器

2 个答案: