Question

我的代码有问题。我正在尝试使用ExtJS和Codeigniter创建上传文件。

以下是我的代码，

 Ext.require([
    'Ext.form.field.File',
    'Ext.form.Panel',
    'Ext.window.MessageBox'
]);

Ext.onReady(function(){

    Ext.create('Ext.form.Panel', {
        title: 'Upload a Photo',
        width: 400,
        bodyPadding: 10,
        frame: true,
        renderTo: Ext.getBody(),
        items: [{
            xtype: 'filefield',
            name: 'photo',
            fieldLabel: 'Photo',
            labelWidth: 50,
            msgTarget: 'side',
            allowBlank: false,
            anchor: '100%',
            buttonText: 'Select Photo...'
        }],

        buttons: [{
            text: 'Upload',
            handler: function() {
                var form = this.up('form').getForm();
                if(form.isValid()){
                    form.submit({
                        url: '../upload',
                        waitMsg: 'Uploading your photo...',
                        success: function(fp, o) {
                            Ext.Msg.alert('Success', 'Your photo "' + o.result.file + '" has been uploaded.');
                            Ext.Ajax.request({
                                url: o.data.url,
                                method: "GET",
                                success: function(response, request) {
                                    // do whatever you need to with the generated HTML
                                    alert(response.responseText);
                                },
                                failure: function(response, request) {
                                    alert('failed');
                                }
                            });
                        }
                    });
                }
            }
        }]
    });

});

但是我的控制台输出显示错误，如“Uncaught Ext.JSON.decode（）：您正在尝试解码无效的JSON字符串”。所以，如果有人有同样的问题或正在解决这个问题，请告诉我..

感谢!!!

结论： 原来如此.. 实际上我使用Codeigniter作为我的框架。如果我将json返回到此URL，这个问题就会解决。

url: '../upload',
waitMsg: 'Uploading your photo...',
success: function(fp, o) {
Ext.Msg.alert('Success', 'Your photo "' + o.result.file + '" has been uploaded.');
Ext.Ajax.request({
   url: o.data.url,
   method: "GET",
   success: function(response, request) {
      // do whatever you need to with the generated HTML
      alert(response.responseText);
   },
   failure: function(response, request) {
      alert('failed');
   }
   });

所以，我像这样创建我的控制器（作为样本）..

public function upload(){
        echo json_encode(1);
    }

并且我的代码没有更多的错误结果.. 谢谢Broncha !!

Answer 1

您的AJAX响应不是纯JSON。尝试在控制台中输出response

success: function(response, request) {
  // do whatever you need to with the generated HTML
  console.log(response);
},

并检查响应是否为纯JSON

Answer 2

我的问题是一样的，我在Google上搜索只知道这个问题的解决方案 URL Solution here

我认为这是使用Sencha Free和Purchase的不同之处。当使用Form.load(...)将JSON对象映射到表单的所有文本字段时，您不仅真实地编写了json字符串，而且还保持这样的格式：

{success:true,data:{... json string object ...}}

Answer 3

有类似的问题，但我实际上有权访问服务器代码进行更改。

ExtJS4

Ext.define('MyApp.store.Thing', {
extend : 'Ext.data.Store',
model : 'MyApp.model.Thing',
autoLoad : true,

proxy : {
    type : 'jsonp', // Needs to be used because we are going cross domain
    url : 'http://remotehost:8081/Servlet',
    reader : {
        type : 'json',
        totalProperty : 'totalCount',
        root : items,
        successProperty : 'success',
    },
} });

Java Servlet

...
String cb = request.getParameter("callback");
response.setContentType("application/x-javascript; charset=utf-8");
usersObject.put("totalCount", usersCount);
usersObject.put("success", true);
usersObject.put("items", itemsArray);
response.getWriter().write(cb + '(' + itemsObject.toString() + ')');
...

这是关键：

response.getWriter（）。write（ cb +'（'+ itemsObject.toString（）+'）'）;

Answer 4

我在Struts 2下遇到了这个错误。

我所要做的就是在struts.xml中使用以下内容：

<result name="success" type="stream">
    <param name="contentType">application/json</param>
    <param name="inputName">someBeanAttribute</param>
</result>

因此，基本上您需要在应用程序的某处指定application/json。

Answer 5

public class UploadHelper {
    /**
     * @param responseContext
     * @throws IOException
     */
    public static void writeHtmlResponse(String responseContext) throws IOException {
        HttpServletResponse response = ServletActionContext.getResponse();
        response.setCharacterEncoding("utf-8");
        response.setContentType("text/html");
        Writer writer = ServletActionContext.getResponse().getWriter();
        StringBuffer sb = new StringBuffer();
        sb.append("<html>\n");
        sb.append("\n<pre>");
        sb.append(responseContext);
        sb.append("</pre>\n");
        sb.append("<script type='text/javascript'> \n window.name='").append(responseContext).append("';").append("</script>");
        sb.append("\n</html>");
        writer.write(sb.toString());
        writer.close();
    }
}

错误：未捕获Ext.JSON.decode（）：您正在尝试解码无效的JSON字符串

5 个答案: