如何对 ASP.NET MVC 控制器进行有效的 Ajax 调用？

使用 jQuery 向 ASP.NET MVC 控制器发起 Ajax 请求的完整指南

本文将指导您如何使用 jQuery 向 ASP.NET MVC 控制器发起 Ajax 请求，包括控制器和视图的实现，以及客户端与服务器的通信。

控制器操作

您的控制器应定义处理 Ajax 请求的操作。以下示例中，FirstAjax 是一个以 JSON 格式响应数据的操作：

<code class="language-csharp">public ActionResult FirstAjax()
{
    return Json("chamara", JsonRequestBehavior.AllowGet);
}</code>

视图

视图初始化 jQuery 并向 FirstAjax 操作发起 Ajax 请求。该请求包含一个成功处理程序，用于在警告框中显示响应：

<code class="language-javascript">$(document).ready(function () {
    var serviceURL = '/AjaxTest/FirstAjax';

    $.ajax({
        type: "POST",
        url: serviceURL,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: successFunc,
        error: errorFunc
    });

    function successFunc(data, status) {     
        alert(data);
    }

    function errorFunc() {
        alert('error');
    }
});</code>

改进方案

请注意，原始 Ajax 请求中的 data 属性会导致问题，因为您的控制器不期望任何参数。移除此属性并使用 @Url.Action 方法将解决此问题：

<code class="language-javascript">$.ajax({
    url: '@Url.Action("FirstAjax", "AjaxTest")',
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: successFunc,
    error: errorFunc
});</code>

对于包含数据的 POST 请求，您需要修改控制器操作以接受参数，并修改 Ajax 请求以包含数据：

<code class="language-csharp">// 控制器
[HttpPost]
public ActionResult FirstAjax(string a)
{
    return Json("chamara", JsonRequestBehavior.AllowGet);
}

// 视图
$.ajax({
    type: "POST",
    url: '@Url.Action("FirstAjax", "AjaxTest")',
    contentType: "application/json; charset=utf-8",
    data: { a: "testing" },
    dataType: "json",
    success: function() { alert('Success'); },
    error: errorFunc
});</code>

以上是如何对 ASP.NET MVC 控制器进行有效的 Ajax 调用？的详细内容。更多信息请关注PHP中文网其他相关文章！