jQuery Datatables Web APIに正しくアクセスしないAJAXリクエスト

Question

ASP.NET Web API 2とjQuery Datatables 1.10.7を統合しようとしています。ここで

を、私は私のDataTableの中にサーバー側の処理を使用したいので、私はDataTables.AspNet.WebApi2 Nugetパッケージを使用しています

は私のjavascriptが

ある

<script> 
    $(document).ready(function() { 
     $('#example').dataTable({ 
      "serverSide": true, 
      "ajax": "/api/StudentsBasicInfo/GetPaginatedStudentsList2", 
      columns: [ 
      { 
       name: 'FirstName', 
       data: 'FirstName', 
       title: "First Name", 
       sortable: false, 
       searchable: false 
      }, 
      { 
       name: 'LastName', 
       data: "LastName", 
       title: "Last Name", 
       sortable: false, 
       searchable: false 
      } 
      ] 
     }); 
    }); 
</script> 

ここに私のHTMLは

です

<table id="example" class="display" cellspacing="0" width="100%"> 
</table> 

ここは自分のWeb APIです

public JsonResult<IDataTablesResponse> GetPaginatedStudentsList2(IDataTablesRequest request) 
    { 
     StudentsInfoHybrid searchObj = new StudentsInfoHybrid(); 

     StudentsBasicInfoBL blClass = new StudentsBasicInfoBL(); 

     try 
     { 
      searchObj.PageSize = request.Length; 
      searchObj.Offset = request.Start; 
      searchObj.count = false; 

      //get the list of students 
      var students = blClass.GetAllStudentsHybridInfo(searchObj); 

      //filter list according to the criteria passed in the request object 
      var filteredStudents = students.Where(i => i.FirstName.Contains(request.Search.Value)).ToList(); 

      //reset page size and offset so that count of total objects can be obtained 
      searchObj.PageSize = 0; 
      searchObj.Offset = 0; 

      var totalCount = blClass.CountAllStudentsHybridInfo(searchObj); 

      var response = DataTablesResponse.Create(request, students.Count(), filteredStudents.Count(), filteredStudents); 

      return new DataTablesJsonResult(response, Request); 

     } 
     catch (Exception ex) 
     { 
      return null; 
     } 
     finally 
     { } 
    } 

私のコードは完璧に構築しますが、データテーブルのコールのWeb APIは、私はIDataTablesRequest要求オブジェクトがnullでデバッグモードで見ることができます実行中。

次はGoogle Chromeネットワークログのスクリーンショットです。

私はネットワークログから見ることができるように、ウェブAPIは、私がおよそ見当もつかないこの例外を返しています。

​​

私のリクエストがGoogle Chromeのネットワークログのように見える別のスクリーンショットも添付しています。あなたが何かを送信していないwebapiにAJAX呼び出しを送信している間

Answer 1

あなたwebapi controller方法は、タイプIDataTablesRequestのオブジェクトを期待しています。

あなたは。あなたは、JavaScriptでObjectを使用してIDataTablesRequestのオブジェクトを作成し、WEBAPIに送信することができますajaxのdataパラメータを使用してIDataTablesRequest objectを送信する必要があります。

var request = new Object(); 
request.Length = 10; 
request.Start = 1; 
$('#example').dataTable({ 
    "ajax": { 
    "url": "/api/StudentsBasicInfo/GetPaginatedStudentsList2", 
    "data": request 
    } 
}); 

また、あなたはHttpPostとしてあなたWEBAPI方法を飾られている場合ajaxのPOSTとしてproperty typeを設定する必要があるかもしれません。私はあなたがASP.NETのWeb APIとのDataTableを使用するために、任意のNugetパッケージを必要とそうは思わない

https://datatables.net/reference/option/ajax.data

https://cmatskas.com/server-side-jquery-datatables-with-asp-net/

Answer 2

あなたは以下をチェックすることができます詳細については

をリンクします。 DatatablesのAJAXリクエストとレスポンスのパラメータでマップされたプレーンなC＃クラスを記述することができます。カスタムModel Binderクラスを定義して、Datatables HTTPリクエストパラメータをカスタムクラスに自動的にバインドすることもできます。私の答えを詳しく説明した記事があります。

http://www.ezzylearning.com/tutorial/using-jquery-datatables-with-asp-net-web-api

http://www.ezzylearning.com/tutorial/jquery-datatables-paging,-sorting-and-searching-with-asp-net-web-api