Ext开发随笔
今天在开发一个项目时，前端用的是EXT框架，在开发过程中碰到一个问题：missing } in XML expression。因为本人是用firefox浏览器的插件FireBug做为调试，所就碰上这事。如果不用firefox可能永远碰到着。发现问题咱们就来解决问题。
使用firedebug跟踪了一下返回的数据, 发现responseText中被加上了<pre></pre>标签，但是在IE中没有<pre>标签，问题就出这里。
浏览一下源代码，发现Ext.form.Action.Submit提交请求是用Ext.Ajax组件进行数据传输的. Ext.form.Action.Submit部分源代码如下所示:
引用
1. ...
2. // private
3. run : function(){
4. var o = this.options;
5. var method = this.getMethod();
6. var isGet = method == 'GET';
7. if(o.clientValidation === false || this.form.isValid()){
8. Ext.Ajax.request(Ext.apply(this.createCallback(o), {
9. form:this.form.el.dom,
10. url:this.getUrl(isGet),
11. method: method,
12. headers: o.headers,
13. params:!isGet ? this.getParams() : null,
14. isUpload: this.form.fileUpload
15. }));
16. }else if (o.clientValidation !== false){ // client validation failed
17. this.failureType = Ext.form.Action.CLIENT_INVALID;
18. this.form.afterAction(this, false);
19. }
20. },
21.
22. // private
23. success : function(response){
24. //问题源
25. var result = this.processResponse(response);
26. if(result === true || result.success){
27. this.form.afterAction(this, true);
28. return;
29. }
30. if(result.errors){
31. this.form.markInvalid(result.errors);
32. this.failureType = Ext.form.Action.SERVER_INVALID;
33. }
34. this.form.afterAction(this, false);
35. },
36.
37. processResponse : function(response){
38. this.response = response;
39. if(!response.responseText){
40. return true;
41. }
42. this.result = this.handleResponse(response);
43. return this.result;
44. }
45. ...
因为在processResponse函数处理数据时出现异常,所以就出现了上面碰到的问题.那么怎么解决它呢,重写processResponse方法就OK了.在你所使用的JS中加入如下一段代码就OK了.
引用
1. Ext.override(Ext.form.Action.Submit,{
2. // private
3. processResponse : function(response){
4. this.response = response;
5. //增加下面几句代码就OK啦
6. ////////////////////////
7. var data = response.responseText;
8. if(data.indexOf('<pre>') != -1) {
9. response.responseText = data.substring(5, data.length-6);
10. this.response = Ext.util.JSON.decode(response.responseText);
11. }
12. ///////////////////////////
13. if(!response.responseText){
14. return true;
15. }
16. this.result = this.handleResponse(response);
17. return this.result;
18. }
19. });