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 中国語 Web サイトの他の関連記事を参照してください。