0 0

Ext.form.FormPanel 接收 JSON 数据10

我要实现的功能是 在双击grid里面的行后 获取该行的ID 然后把ID传到后台service层做处理, 返回该行数据
项目采用 spring+hibernate+ExtJS+DWR 实现

以前做的时候 我在双击grid行的时候,传递record 执行以下方法,
function operate(record){
        myForm.getForm().loadRecord(record)
        myWindow.show();
    };


这样是很简单, 但是如果我在form里面有复选框 就无法绑定, 所以我选择后者, 与后台service层交互
这个时候 我在双击grid里面行的时候, 就传递id 执行以下方法,

function operate(personId){
        myForm.getForm().load({
            url: myPerson.findById(personId)
        });
        myWindow.show();
    };

后台findById 如下
public void findById(Long id, HttpServletResponse response) {
        Person person = personDAO.findById(id);
        List list = new ArrayList();
        list.add(person);
        JSONObject job = new JSONObject();
        job.put("success", true);
        job.put("person", list);
        try {
            System.out.println(job.toString());
            response.getWriter().print(job.toString());
        } catch (IOException e) {
            // TODO Auto-generated catch block
            System.out.println("ok1");
            e.printStackTrace();
        }
    }


后台进去了 System.out.println(job.toString()); 打印有值 值为
{"person":[{"sex":"1","age":"25","hobby":"1,3","personId":1001,"personName":"Damon"}],"success":true}

我的formpanel 是这样写的

var myForm = new Ext.form.FormPanel({
        width: 300,
        bodyStyle: 'padding:5px 5px 0',
        frame: true,
        reader: new Ext.data.JsonReader({
            successProperty: 'success',
            root: 'person'
        },['personId','personName','sex','age','hobby']),
        items: [
            {
                fieldLabel:'PERSONID',
                xtype:'textfield',
                readOnly:true,
                name:'personId',
                id:'personId',
                readOnly: true
            }。。。。。。。

后面部分我省略了, 结果取不到值, 弄了半天没弄出来, 请各位帮帮我, 谢谢
2012年2月03日 13:32

2个答案 按时间排序 按投票排序

0 0

另外可以看看一下2个文章
http://www.iteye.com/topic/173897
http://man1900.iteye.com/blog/773769

2012年2月08日 18:06
0 0

后台返回的数据
改成如下格式试试

{"person":{"sex":"1","age":"25","hobby":"1,3","personId":1001,"personName":"Damon"},"success":true} 

2012年2月08日 18:04

相关推荐

    Ext form_load

    在Ext JS中,`Ext.form_load`涉及到的主要知识点是FormPanel的数据加载机制,这包括了对FormPanel的form对象、BasicForm、doAction方法、Ext.form.Action对象以及JsonReader的使用。以下是对这些概念的详细解释: 1...

    Ext.FormPanel 提交和 Ext.Ajax.request 异步提交函数的区别

    总结,`Ext.FormPanel`的`getForm().submit()`更适合处理基于表单的数据提交,它简化了表单数据的处理和验证,而`Ext.Ajax.request`则提供了更高的灵活性,适用于各种HTTP请求,特别是当需要发送非表单数据或处理...

    Ext 动态加载表单数据

    Ext Form提供了一种结构化的方式来组织这些字段,并提供了验证、提交和数据绑定等功能。 动态加载表单数据涉及到的主要知识点包括: 1. **JSON数据格式**:JSON(JavaScript Object Notation)是一种轻量级的数据...

    Extjs4的FormPanel从后台load json数据的要点

    在Extjs4中,可以使用`form.load()`方法将JSON数据加载到FormPanel中。这个方法接收一个配置对象作为参数,该对象通常包括URL、请求类型(GET或POST)、成功回调函数和失败回调函数等属性。当后端服务器返回JSON数据...

    ext 的ppt ext 的ppt ext 的pptext 的pptext 的ppt

    首先,我们注意到描述中提到了一些常见的问题,如Grid不显示数据,这可能由于JSON数据格式错误或者Ext JS代码中的元素与数据不匹配导致。解决这类问题通常需要检查前端代码和服务器返回的JSON字符串,确保数据格式...

    ext几个实例

    在EXTJS中,Ext.AJAX和Ext.FormPanel是两个核心组件,它们分别用于异步与服务器进行数据交互和构建用户界面表单。本文将详细介绍如何使用这两个组件构建一个完整的登录案例,包括与MySQL数据库的交互。 **1. Ext....

    EXT3.2 多选下拉框

    var formPanel = new Ext.form.FormPanel({ items: [multiSelectComboBox], renderTo: Ext.getBody() }); ``` 在上述代码中,我们创建了一个JSON数据存储,并将其与ComboBox关联。设置`multiSelect: true`后,...

    struts+extjs实现UploadDialog

    为了创建一个UploadDialog,你可以使用`Ext.window.Window`或`Ext.container.Viewport`来创建一个弹出窗口,里面包含一个`Ext.form.FormPanel`,并在其中添加`FileField`。当用户选择文件并点击提交按钮时,ExtJS会...

    ExtJs4.0 表单提交Demo

    在使用Ext Ajax提交表单前,通常需要先将表单数据序列化为JSON或URL编码格式。ExtJs 4.0的FormPanel对象提供了`getForm()`方法获取表单实例,然后通过`form.submit()`或`form.serialize()`方法完成数据的序列化。 ...

    ext学习资料ext学习资料

    Form组件,即`Ext.form.FormPanel`,用于创建和管理表单数据。它可以包含各种输入控件,如文本字段、复选框、下拉列表等。表单数据可以方便地提交到服务器,或者与数据存储进行双向绑定。下面是一个创建简单表单的...

    EXT异步提交FORM表单

    var result = Ext.util.JSON.decode(response.responseText); ``` #### 三、EXT与Struts2/Spring2.5框架集成 ##### 3.1 Struts2集成 - **配置Action**:为了使EXT能够与Struts2框架进行通信,首先需要定义一个...

    Ext3.0 api帮助文档

    - **Ext.form.FormPanel**: 创建表单的容器,支持多种表单元素和验证。 - **Ext.form.Field**: 表单字段类,如文本框、选择框、日期选择器等。 - **Ext.form.BasicForm**: 提供表单的提交和数据验证功能。 7. **...

    Ext与后台数据库交互

    `Ext.form.FormPanel`是Ext框架中用于处理表单的主要组件之一,它提供了一系列的方法来管理和提交表单数据。 - **submit方法**:`FormPanel.getForm().submit()`方法用于提交当前表单。该方法支持传递一些参数,如`...

    老师整理的extjs学习笔记

    提交 `Ext.form.FormPanel` 表单可以通过调用 `form.submit()` 方法来实现。该方法接受一个配置对象,其中可以指定服务器端的 URL、提交成功或失败后的回调函数等。 ```javascript formPanel.getForm().submit({ ...

    extjs文档的详细介绍

    本文将详细介绍EXTJS中两种主要的前后台数据传递方法:`Ext.Ajax.request` 和 `FormPanel` 的 `getForm().submit()`。 首先,`Ext.Ajax.request` 是EXTJS提供的一个全局Ajax对象,用于发送异步HTTP请求。它的基本...

    extjs非常好的几个例子,包括登陆,动态编辑表格等

    在两个登录示例中,我们分别看到了基于HTML form表单和Ext.FormPanel的EXTJS登录实现: 1. **HTML form 表单登录**: 这个例子中,EXTJS使用了Ext.AJAX配合HTML form表单进行登录验证。前端代码创建了一个form表单...

    Ext+JS高级程序设计.rar

    6.3.5 在form中使用Ext.Direct提交数据 187 6.3.6 使用polling方式进行轮询 189 6.4 本章小结 191 第7章 Store 192 7.1 Store的结构 192 7.2 Ext.data.Field 197 7.3 Ext.data.Record 198 7.4 ArrayReader、...

    ext2.0

    EXT 中的表单组件(`Ext.form.FormPanel`)在数据交互中起着关键作用。例如,`createForm()` 方法创建了一个包含输入字段的表单面板,允许用户输入或编辑数据。表单的提交是通过 `form.submit()` 实现的,它支持异步...

    ext 学习笔记

    当涉及到表单时,`Ext.getCmp("formId").getForm()`返回一个`Ext.form.FormPanel`实例,这允许开发者进一步操作表单,比如提交表单数据、验证字段等。 ### 数据绑定与组合框操作 在Ext JS中,组合框(`combo`)是一...

Global site tag (gtag.js) - Google Analytics