从ASP的Ajax.ActionLink获取JSonResult

时间:2011-07-07 20:30:06

标签: asp.net-mvc-3 asp.net-ajax

如何使用Ajax.ActionLink从控制器方法实际获取JSON?我尝试搜索网站,但最接近的是ASP.NET MVC controller actions that return JSON or partial html

“最佳答案”实际上并没有告诉你如何从ajax.actionlink中的SomeActionMethod获取JSON。

1 个答案:

答案 0 :(得分:13)

我个人不喜欢Ajax.*助手。在ASP.NET MVC中< 3他们用javascript污染我的HTML,在ASP.NET MVC 3中,他们使用完全冗余的HTML 5 data-*属性污染我的HTML(例如锚点的url)。此外,它们不会自动解析成功回调中的JSON对象,这就是您的问题所在。

我使用普通的Html.*助手,如下所示:

@Html.ActionLink(
    "click me",           // linkText
    "SomeAction",         // action
    "SomeController",     // controller
    null,                 // routeValues
    new { id = "mylink" } // htmlAttributes
)

显然会生成普通 HTML:

<a href="/SomeController/SomeAction" id="mylink">click me</a>

我在不同的javascript文件中不引人注意地使用AJAXify:

$(function() {
    $('#mylink').click(function() {
        $.post(this.href, function(json) {
            // TODO: Do something with the JSON object 
            // returned the your controller action
            alert(json.someProperty);
        });
        return false;
    });
});

假设以下控制器操作:

[HttpPost]
public ActionResult SomeAction()
{
    return Json(new { someProperty = "Hello World" });
}

更新:

根据评论部分的要求,这里是如何使用Ajax.*助手来做的(我再说一遍,这只是说明如何实现这一点,绝对不是我推荐的,请参阅我的初步答案我推荐的解决方案):

@Ajax.ActionLink(
    "click me", 
    "SomeAction",
    "SomeController",
    new AjaxOptions { 
        HttpMethod = "POST", 
        OnSuccess = "success" 
    }
)

并在成功回调中:

function success(data) {
    var json = $.parseJSON(data.responseText);
    alert(json.someProperty);
}