web-dev-qa-db-ja.com

AjaxによってASP.NET MVC C#でアクションメソッドを呼び出すjQuery

私はこれを機能させるために何時間も試しましたが、私はあなたの1人が私よりもこれについてもっと知っていることを本当に望んでいます。クライアントがテキストボックスでキーを押したら、MVC C#コントローラーを呼び出したいですupdateOrder()と呼ばれるメソッド。理想的には、FormCollectionを使用してフォーム要素にアクセスしたい(フォームは「createOrder」と呼ばれます)。

コントローラには、次のものが含まれます。

C#

[WebMethod]
public static void updateOrder(){
    string s = "asdf";
}

上記の文字列宣言にはブレークポイントが設定されています。ビューでは、stackoverflowで見つけた基本的にコピーして貼り付ける方法があります。

JavaScript

function updateOrderJS() {
    var $form = $('form[id="createOrder"]');
    $.ajax({type    : "POST",
        url     : $form.attr('action'),
        data    : $form.serialize(),
        error   : function(xhr, status, error) {},
        success : function(response) {
             updateOrder();
        }
    });
    return false;
}

イベントは単純です:

JavaScript

updateOrderJS();

UpdateOrderJS()メソッドは起動しますが(アラートでチェックされます)、ブレークポイントは起動しません。

9
user4855057

Asp.Net MVCでは、WebMethodでメソッドを装飾する必要はありません。アクション(メソッド)を作成し、それから結果を返すだけです。サンプル:

public class CustomerController : Controller 
{
   public ActionResult Index() 
   {
       return View();
   }

   [HttpPost]
   public ActionResult UpdateOrder()
   {
      // some code
      return Json(new { success = true, message = "Order updated successfully" }, JsonRequestBehavior.AllowGet);
   }
}

そしてViewで、次のようなJavaScriptを試すことができます(- $。ajax jqueryメソッドを使用-コメントを参照):

$.ajax({
    url: '@Url.Action("UpdateOrder")', // to get the right path to controller from TableRoutes of Asp.Net MVC
    dataType: "json", //to work with json format
    type: "POST", //to do a post request 
    contentType: 'application/json; charset=utf-8', //define a contentType of your request
    cache: false, //avoid caching results
    data: {}, // here you can pass arguments to your request if you need
    success: function (data) {
         // data is your result from controller
        if (data.success) { 
            alert(data.message);
        }
    },
    error: function (xhr) {
        alert('error');
    }
});
20
Felipe Oriani

MVCでは、_[WebMethod]_は必要ありません。通常のコントローラーアクションでActionMethod(または、戻り値が必要ない場合はnull)を返すことができます。静的メソッドのWebMethod属性はWebフォーム用であり、MVCではありません。

_public ActionMethod updateOrder(MyModel someModel) {
    // Do something
    return null;
}
_

JavaScriptのURLはそのアクションのURLであり、Razorで@Url.Action("updateOrder", "Orders")を使用して取得できます。「Orders」はコントローラーの名前です。

3
Joe Enos
  1. 「url」の形式がpage.aspx/updateOrderであることを確認します。

  2. _datatype: json_を指定します

  3. updateOrderJS()が呼び出されていることを確認してください。

  4. _contentType: "application/json; charset=utf-8"_が含まれていることを確認します。

注:_[WebMethod]_は、MVCではなく、webformsメソッドの呼び出しに使用されます。

0
garryp

_<form>_タグのaction属性にMVCルートのURLを入力しているようです。あなたがあなたのhtmlを投稿しなかったので、私はその属性がどのように見えるかを見ることができませんが、私から見るとその属性の値は間違っているかもしれません。

ほとんどの場合、特定のMVCアクションへのURLはhttp://ServerDomain/Path(IfAny)/ControllerName/ActionNameです。たとえば、次のようなコントローラとアクションがある場合...

_public class StackController
{
    [HttpPost]
    public ActionResult Overflow()
    {
        return View();
    }
}
_

...そして、ASP.NETアプリケーションがwww.example.comにデプロイされている場合、_<form>_タグのaction属性のURLは_http://www.example.com/Stack/Overflow_になります。

もちろん、global.asaxのRegisterRoutesメソッドでのルートの設定や、コントローラーがエリアに分割されている場合など、ASP.NET MVCの他の設定でこれらのURLを変更することは可能です。 _<form>_のURLが正しい場合は、ASP.NETアプリに関連するコントローラールーティングコードとともにhtmlを投稿してください。

フォームがRazorビュー(cshtmlファイル)内にある場合は、<form action="@Url.Action({ controller = "ControllerName", action = "ActionName" })" method="post">を使用して正しいフォームURLを生成できます。

0
Joshua Carmody