如何使用带有JSON结果的Ajax.BeginForm MVC助手？

Question

我正在尝试使用ASP.NET MVC Ajax.BeginForm帮助程序,但不希望在调用完成时使用现有的内容插入选项.相反,我想使用自定义JavaScript函数作为回调.

这有效,但我想要的结果应该作为JSON返回.不幸的是,框架只是将数据视为字符串.以下是客户端代码.服务器代码只返回一个带有一个字段UppercaseName的JsonResult.

<script type='text/javascript'>
    function onTestComplete(content) {
        var result = content.get_data();
        alert(result.UppercaseName);
    }
</script>

<% using (Ajax.BeginForm("JsonTest", new AjaxOptions() {OnComplete = "onTestComplete" })) { %>
    <%= Html.TextBox("name") %><br />
    <input type="submit" />
<%} %>

而不是显示大写结果,而是显示未定义.content.get_data()似乎包含JSON,但只能以字符串形式存在.如何将其转换为对象？

所有这些看起来有点令人费解.有没有更好的方法来使用Ajax.BeginForm获取结果内容？如果这很难,我可以完全跳过Ajax.BeginForm并只使用jQuery表单库.

Answer 1

你可以用OnFailure而OnSuccess不是OnComplete; OnSuccess为您提供适当的JSON对象数据.您可以找到~/Scripts/jquery.unobtrusive-ajax.min.js要在页面上加载的回调方法签名.

在你的Ajax.BeginForm:

new AjaxOptions
    {
        OnFailure = "onTestFailure",
        OnSuccess = "onTestSuccess"
    }

脚本块:

<script>
//<![CDATA[

    function onTestFailure(xhr, status, error) {

        console.log("Ajax form submission", "onTestFailure");
        console.log("xhr", xhr);
        console.log("status", status);
        console.log("error", error);

        // TODO: make me pretty
        alert(error);
    }

    function onTestSuccess(data, status, xhr) {

        console.log("Ajax form submission", "onTestSuccess");
        console.log("data", data);
        console.log("status", status);
        console.log("xhr", xhr);

        // Here's where you use the JSON object
        //doSomethingUseful(data);
    }

//]]>
</script>

这些签名在$ .ajax(...)中匹配success和error回调,毕竟这可能不是一个惊喜.

这是使用带有jquery 1.6.3和1.7.2的asp.net-mvc-3进行测试的.

Answer 2

试试这个:

var json_data = content.get_response().get_object();

这将为您提供JSON格式的结果,您可以使用它json_data[0]来获取第一条记录