如何對 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中文網其他相關文章！