未捕获Ext.Error：你试图解码无效的JSON字符串：表单提交使用的Ext JS和Spring MVC

我提出我的Ext JS的形式后得到以下错误：未捕获Ext.Error：你试图解码无效的JSON字符串：表单提交使用的Ext JS和Spring MVC

Uncaught Ext.Error: You're trying to decode an invalid JSON String

JS：

Ext.onReady(function() { 

     var simple = Ext.create('Ext.form.Panel', { 

        frame : true, 
        title : 'Login Form', 
        bodyStyle : 'padding:5px 5px 0', 
        width : 350, 
        fieldDefaults : { 
         msgTarget : 'side', 
         labelWidth : 75 
        }, 
        defaultType : 'textfield', 
        defaults : { 
         anchor : '100%' 
        }, 

        items : [{ 
           fieldLabel : 'User Name', 
           name : 'userName', 
           allowBlank : false, 
           emptyText : 'UserName' 
          }, { 
           fieldLabel : 'Password', 
           name : 'password', 
           allowBlank : false, 
           inputType : 'password', 
           emptyText : 'Password' 
          }], 

        buttons : [{ 
         text : 'Save', 
         handler : function() { 
          var form = this.up('form').getForm(); 
          form.submit({ 
             url : saveFormUrl 
            // waitMsg : 'Sending the info...', 
            // success : function(fp, o) { 
            //  Ext.Msg.alert('Success', 
            //    'Form submitted.'); 
            // } 
            }); 
         } 
        }, { 
         text : 'Cancel' 
        }] 
       }); 
     simple.render(document.body); 
     simple.getEl().center(); 
    });

Controller类：

@Controller 
public class UserController { 

private static final Logger logger = LoggerFactory 
     .getLogger(TController.class); 

private TService tService = null; 

@Autowired 
public void setTService(TService tService) { 
    this.tService = tService; 
} 

@RequestMapping(value = "/index.html", method = RequestMethod.GET) 
public String home() { 
    System.out.println("Welcome home!"); 
    return "login"; 
} 

@RequestMapping(value = "/save-form.html", method = RequestMethod.POST) 
public ModelAndView submitData(User user){ 
    System.out.println("User name:"+user.getUserName()); 
    ModelAndView mv = new ModelAndView("htmlLinks"); 
    return mv; 
}

保存-form.html：

<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%> 
<%@ page session="false"%> 
<c:set var="ctx" value="${pageContext.request.contextPath}" /> 
<html> 
<head> 
<title>POC</title> 

</head> 
<body> 
Welcome User !! 
</body> 
</html>

我在做什么错？解决办法是什么？我正在使用Ext JS 4和Spring MVC。

来源

2012-07-24 J Modi

你已经采取了看看这个：http://stackoverflow.com/questions/7023531/extjs-4-spring-3-file-upload-server-sends-bad-response-content-type – andy 2012-07-24 17:05:24

我曾看过它，但我的问题是，我从Spring控制器类返回时解析另一个jsp。所以，我不确定，我该怎么做？ – 2012-07-24 18:28:48

我没有extJS的经验，但抛出异常在哪里（是否在JS中注释掉的行中）？另外，你打算如何使用HTML响应？ – andy 2012-07-24 21:18:08

按照documentation为form.submit，它看起来像响应需要是JSON或XML，格式如下所示：

{ 
    success: true, 
    data: { 
     url: "http://somewhere", 
     someData: "whatever you want" 
    } 
}

在JavaScript中的成功处理，你可以参考o.data.[variable]得到自定义数据。

不幸的是，您将需要更改submitData method（在您的控制器中）以返回上面定义的结构中的JSON响应对象。在响应对象中，您可以包含一个到save-form.html的URL。然后，您可以在成功处理程序中为其添加GET请求。

我不知道这是否会工作，因为我有Ext JS的没有经验，但我会想象的成功处理程序看起来像这样：

success: function(fp, o) { 
    Ext.Msg.alert('Success', 'Form submitted.'); 
    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'); 
     } 
    }); 
}

来源

2012-07-24 22:31:11 andy

嗨，@安迪，谢谢你的回复。我使用下面的代码解决了它。 [代码] 按钮：[{ \t \t \t \t \t \t \t \t \t文本： '保存'， \t \t \t \t \t \t \t \t \t处理程序：功能（）{ \t \t \t \t \t \t \t \t \t \t //该getForm（）方法返回 \t \t \t \t \t \t \t \t \t \t // Ext.form.Basic实例： \t \t \t \t \t \t \t \t \t \t变种形式= this.up（'形式“）.getForm（）; \t \t \t \t \t \t \t \t \t \t form.submit（）; \t \t \t \t \t \t \t \t \t} \t \t \t \t \t \t \t \t}，{ \t \t \t \t \t \t \t \t \t文字： '取消' \t \t \t \t \t \t \t \t}] [/ code] – 2012-07-30 19:41:12

感谢所有的答复。我使用下面的代码解决了它。

buttons : [{ 
    text : 'Save', 
    handler : function() { 
     // The getForm() method returns the 
     // Ext.form.Basic instance: 
     var form = this.up('form').getForm(); 
     form.submit(); 
    } 
}, { 
    text : 'Cancel' 
}]

来源

2013-01-17 19:35:31

未捕获Ext.Error：你试图解码无效的JSON字符串：表单提交使用的Ext JS和Spring MVC

回答

相关问题