`
witcheryne
  • 浏览: 1099119 次
  • 性别: Icon_minigender_1
  • 来自: 西安
社区版块
存档分类
最新评论

jquery ajaxFileUpload插件的 missing } in XML expression错误处理

阅读更多

    最近使用jQuery的ajaxFileUpload插件来做ajax文件上传。文件上传没有遇见问题,但是接受从服务器端响应的json总是报SyntaxError: missing } in XML expression的错误.. 起初IE和FireFox都报.. 后来只有firefox报错..

 

    之后使用firedebug跟踪了一下返回的数据, 发现responseText中被加上了<pre></pre>标签...   但是在IE中没有<pre>标签。 很有可能是<pre></pre>惹的祸..   

 

   在调用eval前添加如下代码,将<pre></pre>去掉,问题搞定!

 

    if(data.indexOf('<pre>') != -1) {
          data = data.substring(5, data.length-6);
    }         
    eval("data=" + data);   

 

 

PS: 折腾人这么长时间!!  浏览器兼容问题实在 XXXX 了!!

分享到:
评论
5 楼 witcheryne 2009-07-07  
379548695 写道
看过啦form的submit就是用得这个他是已经封装好的。只能改源代码吗?

我知道封装好了..
  Form表单的提交,其实是调用了Ext.Ajax.request 这个方法,你可以用这个方法来发送请求... 跟调用Submit效果是一样的。。
  关于Form工作原理方面的你可以看我之前写的《Ext JS Form提交数据总结》这篇文章...

Form提交实际上是调用的下面这部分代码,这部分代码可以在Ext.form.Action找到, 应该是256行(我的Ext JS版本是 2.2)
Ext.form.Action.Submit = function(form, options){
    Ext.form.Action.Submit.superclass.constructor.call(this, form, options);
};

Ext.extend(Ext.form.Action.Submit, Ext.form.Action, {
    /**
    * @cfg {Ext.data.DataReader} errorReader <b>Optional. JSON is interpreted with no need for an errorReader.</b>
    * <p>A Reader which reads a single record from the returned data. The DataReader's <b>success</b> property specifies
    * how submission success is determined. The Record's data provides the error messages to apply to any invalid form Fields.</p>.
    */
    /**
    * @cfg {boolean} clientValidation Determines whether a Form's fields are validated
    * in a final call to {@link Ext.form.BasicForm#isValid isValid} prior to submission.
    * Pass <tt>false</tt> in the Form's submit options to prevent this. If not defined, pre-submission field validation
    * is performed.
    */
    type : 'submit',

    // private
    run : function(){
        var o = this.options;
        var method = this.getMethod();
        var isGet = method == 'GET';
        if(o.clientValidation === false || this.form.isValid()){
            Ext.Ajax.request(Ext.apply(this.createCallback(o), {
                form:this.form.el.dom,
                url:this.getUrl(isGet),
                method: method,
                headers: o.headers,
                params:!isGet ? this.getParams() : null,
                isUpload: this.form.fileUpload
            }));
        }else if (o.clientValidation !== false){ // client validation failed
            this.failureType = Ext.form.Action.CLIENT_INVALID;
            this.form.afterAction(this, false);
        }
    },

    // private
    success : function(response){
        var result = this.processResponse(response);
        if(result === true || result.success){
            this.form.afterAction(this, true);
            return;
        }
        if(result.errors){
            this.form.markInvalid(result.errors);
            this.failureType = Ext.form.Action.SERVER_INVALID;
        }
        this.form.afterAction(this, false);
    },

    // private
    handleResponse : function(response){
        if(this.form.errorReader){
            var rs = this.form.errorReader.read(response);
            var errors = [];
            if(rs.records){
                for(var i = 0, len = rs.records.length; i < len; i++) {
                    var r = rs.records[i];
                    errors[i] = r.data;
                }
            }
            if(errors.length < 1){
                errors = null;
            }
            return {
                success : rs.success,
                errors : errors
            };
        }
        return Ext.decode(response.responseText);
    }
});


4 楼 379548695 2009-07-07  
看过啦form的submit就是用得这个他是已经封装好的。只能改源代码吗?
3 楼 witcheryne 2009-07-05  
379548695 写道
我这样写怎么还有错误啊。跟你的问题一样啊。
form.getForm().submit({
success : function() {
// if (action.indexOf('<pre>') != -1) {
// action = action.substring(5, action.length - 6);
// }
// eval("action=" + action);
Ext.Msg.alert('友情提示 ', '图片上传成功');
},
failure : function() {
// if (action.indexOf('<pre>') != -1) {
// action = action.substring(5, action.length - 6);
// }
// eval("action=" + action);

Ext.Msg.alert('友情提示', action.result.message);
},
waitMsg : '正在上传图片,请稍后...'
});

好久没用过原生Ext JS了...
   今天查了一下 API.. 你看以看看 Ext.Ajax.Request 这个方法,Form表单的提交实际上就是用这个方法进行的....
    在回调函数中可以直接操纵 XMLHttpRequest 对象...
2 楼 379548695 2009-07-03  
我是extjs得formpanel提交好像已经封装啦返回的值
1 楼 379548695 2009-07-03  
我这样写怎么还有错误啊。跟你的问题一样啊。
form.getForm().submit({
success : function() {
// if (action.indexOf('<pre>') != -1) {
// action = action.substring(5, action.length - 6);
// }
// eval("action=" + action);
Ext.Msg.alert('友情提示 ', '图片上传成功');
},
failure : function() {
// if (action.indexOf('<pre>') != -1) {
// action = action.substring(5, action.length - 6);
// }
// eval("action=" + action);

Ext.Msg.alert('友情提示', action.result.message);
},
waitMsg : '正在上传图片,请稍后...'
});

相关推荐

    jquery ajaxfileupload上传插件

    jquery ajaxfileupload上传插件,用于ajax的异步文件上传

    jquery ajaxfileupload.js

    jquery ajaxfileupload.js异步上传插件

    WEB文件上传之JQuery ajaxfileupload插件使用(二)

    本文将详细介绍如何使用JQuery的ajaxfileupload插件实现异步文件上传,这在提升用户体验和处理大文件时尤其有用。ajaxfileupload是jQuery的一个扩展,它允许我们在不刷新页面的情况下完成文件的上传操作,使得交互...

    jQuery ajaxFileUpload.js 插件 ie9 下bug 修复

    `jQuery ajaxFileUpload.js` 是一个用于处理文件上传的 jQuery 插件,它允许用户在不刷新页面的情况下实现异步文件上传。这个插件在现代浏览器中通常运行良好,但像许多其他JavaScript库一样,它可能在较老的浏览器...

    jquery.ajaxFileUpload

    综上所述,jQuery插件AjaxFileUpload提供了一种便捷的文件异步上传解决方案,通过合理的配置和适当的服务器端处理,可以构建高效、友好的文件上传功能。在实际应用中,可以根据需求进行定制和扩展,提升用户体验。

    ajaxfileupload上传及解析xml

    本教程将详细讲解如何使用AjaxFileUpload插件上传XML文件,并且解析XML内容。 首先,我们需要了解jQuery库。jQuery是一个强大的JavaScript库,简化了DOM操作、事件处理、动画效果以及AJAX交互。在本示例中,jQuery...

    ajaxFileUpload插件

    ajaxFileUpload插件是一个非常简单的基于Jquery的异步上传文件的插件,使用过程中发现很多与这个同名的,基于原始版本基础之上修改过的插件,文件版本比较多,我把我自己使用的ajaxFileUpload文件上传了

    ajaxfileupload以及jquery的js

    **AjaxFileUpload与jQuery的JS库** 在Web开发中,实时数据交互是不可或缺的一部分,而AjaxFileUpload和jQuery就是实现这种交互的利器。AjaxFileUpload是一个JavaScript组件,它允许用户在不刷新整个页面的情况下...

    使用jQuery ajaxFileUpload+servlet实现文件上传

    `ajaxFileUpload` 是一个基于jQuery的插件,用于处理文件的异步上传,而Servlet是Java服务器端编程的一个接口,用于处理HTTP请求。在这个场景下,我们将探讨如何结合`jQuery ajaxFileUpload` 和Servlet实现文件上传...

    Asp.Net MVC+Jquery ajaxfileupload实现文件上传(v1.0.0)

    本文将详细介绍如何使用Asp.Net MVC框架与Jquery的ajaxfileupload插件实现一个兼容主流浏览器的文件上传解决方案。 首先,Asp.Net MVC是一个强大的Web应用程序开发框架,它允许开发者构建动态、数据驱动的网站。它...

    一个支持Jquery3 的ajaxfileupload.js

    通过修改终于使得ajaxfileupload兼容jquery3,代码已上线运行。

    ajaxfileupload and jquery 1.7.2

    AjaxFileUpload是jQuery的一个插件,它允许用户在不刷新整个页面的情况下上传文件,提供了丰富的功能和良好的用户体验。在这个场景中,我们看到与jQuery 1.7.2版本一起使用的AjaxFileUpload,表明这是一个较旧但经过...

    ajaxFileUpload插件,C#返回Json数据报错问题的解决方案

    在使用ajaxFileUpload插件时,务必确保与后端的数据交换格式一致,并根据返回的数据类型进行相应的处理,以避免类似错误的发生。同时,对于C#后端,确保返回的是纯JSON字符串,不包含任何HTML标签,以保证前端解析的...

    Jquery上传插件文件ajaxfileupload.js 修复版下载

    使用Jquery做上传文件处理时,用到了ajaxfileupload.js 这个第三方代码,但是这个js几乎就是半成品,问题很多。现在整理如下并附修复版的ajaxfileupload.js下载。 问题: 1:无法带参数提交,只能上传文件; 2:...

    jQuery插件AjaxFileUpload实现ajax文件上传

    jQuery插件AjaxFileUpload用来实现ajax文件上传,该插件使用非常简单,接下来写个demo演示怎么用AjaxFileUpload插件实现文件上传。 1、引入AjaxFileUpload插件相关的js 复制代码 代码如下:[removed]resources/js/...

    ajaxfileupload.js 异步上传jquery插件

    **AjaxFileUpload.js** 是一个基于 jQuery 的异步文件上传插件,它允许用户在不刷新页面的情况下上传文件,提供了一种便捷、高效的文件交互体验。这个插件广泛应用于网页应用,尤其是那些需要用户交互频繁上传文件的...

    jquery 插件ajaxfileupload与struts2结合 实现异步上传图片

    在本文中,我们将深入探讨如何将jQuery插件AjaxFileUpload与Struts2框架结合,以实现异步图片上传的功能。这种技术在现代Web应用中非常常见,它提升了用户体验,允许用户在不刷新整个页面的情况下上传文件,特别是...

    jquery+ajaxfileupload+html文件上传

    3. **配置AjaxFileUpload**:使用jQuery选择器获取文件输入元素,并调用AjaxFileUpload方法进行配置,包括设置上传URL、成功回调、错误回调等。 4. **触发上传**:绑定一个点击事件到上传按钮,当点击时触发文件上传...

    ajax上传图片之ajaxfileupload

    报错可能是因为错误处理机制没有被正确地定义或执行,因此我们需要确保在调用`ajaxFileUpload`方法时,配置了适当的错误处理回调,例如: ```javascript $.ajaxFileUpload({ url: 'upload.php', // 服务器端处理...

Global site tag (gtag.js) - Google Analytics