web-dev-qa-db-ja.com

MVC Ajax JSONコントローラーへのポストアクションメソッド

JQuery AJAXパラメーターとして複雑なオブジェクトを含むコントローラーアクションメソッドの呼び出しを達成しようとしています。私はたくさんのブログを読み、これらから学んだいくつかのテクニックを試しました。 Stackoverflow post here を使用して、（以下の）最善の試行コードを作成しました。

ユーザーがフィールドからタブで移動したときに呼び出される非同期投稿をトリガーしたい[フォーム保存投稿ではなく、他の例で示したように]。

私の意図は：

  • クライアントでオブジェクトをインスタンス化します[Viewの型を提供するViewModelではありません]。
  • ビュー内のいくつかのフィールドからのデータをオブジェクトに取り込みます。
  • このオブジェクトをJSONに変換します。
  • JQuery.Ajaxメソッドを使用してコントローラーアクションメソッドを呼び出し、JSONオブジェクトを渡します。

結果はJSON結果として返されます。返される結果に応じて、ビューのフィールドにデータがロードされます。

問題は次のとおりです。

  • アクションメソッドがHttpPost属性に関連付けられている場合、コントローラーのActionメソッドは呼び出されません（AJAX呼び出しタイプが「POST」に設定されている場合でも）。
  • アクションメソッドがHttpGetに関連付けられている場合、パラメーターのプロパティの値はnullです
  • ReadObjectメソッドがエラーをスローします：「名前空間 ''から要素 'root'を期待しています。 '。' namespace 'という名前の' None 'に遭遇しました」。

誰かが助けてくれることを願っています。ありがとう。以下のコード：

クライアントjsファイル

 var disputeKeyDataObj = {
     "InvoiceNumber": "" + $.trim(this.value) + "",
     "CustomerNumber": "" + $.trim($('#CustomerNumber').val()) + ""
  };

  var disputeKeyDataJSON = JSON.stringify(disputeHeadlineData);      

  $.ajax({
     url: "/cnr/GetDataForInvoiceNumber",
     type: "POST",
     data: disputeKeyDataJSON,
     dataType: 'json',
     contentType: "application/json; charset=utf-8",
     success: EnrichedDisputeKeyData(result)
  });


Actionアクションパラメーターに関連付けられたタイプのフィルターとクラス

 [DataContract]  
 public class DisputeKeyData  
 {  
    [DataMember(Name = "InvoiceNumber")]  
    public string InvoiceNumber { get; set; }

    [DataMember(Name = "CustomerNumber")]
    public string CustomerNumber { get; set; }
 }

コントローラーのアクションメソッド

  //[HttpPost]
  [ObjectFilter(Param = "disputeKeyData", RootType = typeof(DisputeKeyData))]  
  public ActionResult GetDataForInvoiceNumber(DisputeKeyData disputeKeyData)  
  {  
     //Blah!  
     //....  
     return Json(disputeKeyData, JsonRequestBehavior.AllowGet);  
  }
asp.net-mvcajaxjson
35
Grant Sutcliffe

以下は、これがどのように機能するかを示しています。

重要な点は、ランタイムが要求内のオブジェクトを解決できるようにするために、ビューに関連付けられたViewModelを使用する必要があったことです。

[デフォルトのViewModelオブジェクト以外のオブジェクトをバインドする方法があることは知っていますが、動作させることができなかったため、必要に応じて必要なプロパティを設定するだけでした]

[HttpPost]  
  public ActionResult GetDataForInvoiceNumber(MyViewModel myViewModel)  
  {            
     var invoiceNumberQueryResult = _viewModelBuilder.HydrateMyViewModelGivenInvoiceDetail(myViewModel.InvoiceNumber, myViewModel.SelectedCompanyCode);
     return Json(invoiceNumberQueryResult, JsonRequestBehavior.DenyGet);
  }

このアクションメソッドを呼び出すために使用されるJQueryスクリプト：

var requestData = {
         InvoiceNumber: $.trim(this.value),
         SelectedCompanyCode: $.trim($('#SelectedCompanyCode').val())
      };


      $.ajax({
         url: '/en/myController/GetDataForInvoiceNumber',
         type: 'POST',
         data: JSON.stringify(requestData),
         dataType: 'json',
         contentType: 'application/json; charset=utf-8',
         error: function (xhr) {
            alert('Error: ' + xhr.statusText);
         },
         success: function (result) {
            CheckIfInvoiceFound(result);
         },
         async: true,
         processData: false
      });
37
Grant Sutcliffe