extjs4+struts2修改表单的加载与提交

使用extjs+struts2开发项目,action端如果直接定义表单变量(如private String user;)则在前台extjs的表单中可以直接使用该名字(name: ‘user’)。但是如果将表单所有变量进行封装(FormVo),然后在action中定义一个变量(private FormVo vo;),那么直接将vo对象转换成json字符串后,在表单中必须也用vo对象内部的变量名而不能使用vo.变量名(vo.user)。

修改表单通常采用下面的方式加载数据:

var mailReader = Ext.create('Ext.data.reader.Json', {
		successProperty : 'success',
		root : 'data',
		model : 'draftboxModel'
	});

定义一个reader,reader中指定了要使用的model。然后表单中指定该reader:

reader: mailReader,

 readmform.load({
	        url: 'loaddraftMail.action',
	        params: {'draftid':draftid}
	    });

以此加载表单数据。

然而,正如上面所说,表单中直接采用vo对象的名字时才可以加载出数据,如果加上vo.前缀,则无法显示。但是在提交表单的修改时,又必须使用vo.前缀方可在action中读出。

处理方法:action中将vo对象转换为json字符串时,在各变量名前添加vo.前缀。

为此,重载JSON类库中相应方法。本人采用的类库在这里。重载JSONObject.toString():

public String toString(String prex) {
        try {
            Iterator     keys = this.keys();
            StringBuffer sb = new StringBuffer("{");

            while (keys.hasNext()) {
                if (sb.length() > 1) {
                    sb.append(',');
                }
                Object o = keys.next();
                sb.append(quote(prex + "." + o.toString()));
                sb.append(':');
                sb.append(valueToString(this.map.get(o)));
            }
            sb.append('}');
            System.out.println("shewea = " + sb.toString());
            return sb.toString();
        } catch (Exception e) {
            return null;
        }
    }

将对象转换为json字符串的方法:

public String ConvertObjToJson(Object obj, String prex) {
		JSONObject jObject = new JSONObject(obj);
		String json = "{success:true,\"data\":[" + jObject.toString(prex)
				+ "]}";
		return json;
	}

action中调用ConvertObjToJson并传递prex为”vo”,转换的字符串即包含了vo.前缀。

在extjs表单中:

方式一:

Ext.Ajax.request({
		    url: 'loaddraftMail.action',
	        params: {'draftid':draftid},
		    success: function(response){
		        var text = response.responseText;
		       	alert(text);
		        var record = Ext.decode(text);
		        var model = Ext.create(modelDef);
		        var r = model;
		        r.data = record.data[0];
		        readmform.loadRecord(r);
		    }
		});

方式二:

var myStore = Ext.create('Ext.data.Store', {
		     model: 'draftboxModel',
		     proxy: {
		         type: 'ajax',
		         url: 'loaddraftMail.action',
		         extraParams: {'draftid':draftid},
		         reader: {
		             type: 'json',
		             root: 'data'
		         }
		     },
		     autoLoad: true
		 });
		 myStore.load({
		    scope: this,
		    callback: function(records, operation, success) {
		 		//alert();
		 		readmform.loadRecord(records[0]);
		    }
		});
This entry was posted in Computer, Java. Bookmark the permalink.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s