【解決方法】jquery データ テーブル ポスト パラメーターを外部 ASP.NET CORE Web API に渡す方法

プログラミングQA


私は苦労しています:
Database-WEB API -Web アプリケーション層があります。 私の Web アプリケーションには、その要求を WEB API の次のメソッドにポストする jquery データテーブルがあります。

public class DataTableAjaxPostModel
   {
       public int? draw { get; set; }
       public int? start { get; set; }
       public int? length { get; set; }
       public List<Column> columns { get; set; }
       public Search search { get; set; }
       public List<Order> order { get; set; }
   }
   public class Column
   {
       public string? data { get; set; }
       public string? name { get; set; }
       public bool? searchable { get; set; }
       public bool? orderable { get; set; }
       public Search? search { get; set; }
   }
   public class Search
   {
       public string? value { get; set; }
       public string? regex { get; set; }
   }
    [HttpPost]
       [Route("Plots/Postdata")]
       public  async Task<ActionResult> Postdata([FromForm] DataTableAjaxPostModel model)
       {
           using (var client = new HttpClient())
           {
               client.DefaultRequestHeaders.Clear();
               client.DefaultRequestHeaders.Accept.Add(new MediaTypeWithQualityHeaderValue("application/json"));
               HttpContent body = new StringContent(JsonConvert.SerializeObject(model), Encoding.UTF8, "application/json");
               HttpResponseMessage Res = await client.PostAsync("https://localhost:7193/api/Erven",body);

               if (Res.IsSuccessStatusCode)
               {

                   var EmpResponse = Res.Content.ReadAsStringAsync().Result;


               return Ok(EmpResponse);
                 }
               }
           return null;
       }

最初の質問: datatable パラメーターは DataTableAjaxPostmodel に自動的にバインドされますか?
2 番目の質問: 上記のコードは正しいですか? 私には少し不器用に見えます (私は開発者ではなく、コーディングが好きな土木技師です)。
HttpResponseMessage の PostAsync は、WEB アプリケーション プロジェクトの「外部」にある次の WEB API メソッドを対象としています。

[HttpPost]
      public async Task<ActionResult>Getdata([FromBody] DataTableAjaxPostModel model)
      {
          string? searchValue = model?.search?.value;

             int? draw = model.draw;
             int? start = model.start;
             int? length = model.length;
             string? sortColumn = model?.columns[model.order[0].column]?.name;
            string? sortColumnDirection = model?.order?[0].dir;
             int pageSize = length != null ? Convert.ToInt32(length) : 0;
             int skip = start != null ? Convert.ToInt32(start) : 0;
             int filteredRecords = 0;

          var query =this._UoW.Repository<Progressreport>().Query();

         if (!(string.IsNullOrEmpty(sortColumn) && string.IsNullOrEmpty(sortColumnDirection)))
          {
              query = query.OrderBy(sortColumn + " " + sortColumnDirection);
          }
          if (!string.IsNullOrEmpty(searchValue))
          {
              query = query.Where( p => p.Inspector.ToLower().Contains(searchValue.ToLower()) ||
                                   p.Projectname.ToLower().Contains(searchValue.ToLower()) ||
                                   p.Plot.ToString().ToLower().Contains(searchValue.ToLower()) ||
                                   p.Status.ToLower().Contains(searchValue.ToLower()));
          }

           int recordsTotal = await query.CountAsync();

          var data = await query.Skip(skip).Take(pageSize).ToListAsync();
          filteredRecords =  data.Count();


          var jsonData = new { draw = draw, recordsFiltered = filteredRecords, recordsTotal = recordsTotal, data = data };
          return Ok(jsonData);
      }

3 番目の質問。 このコーディングは正しいですか? JSONData は正しく返されますか?
最後に、Jquery データテーブル スクリプト

<script>
        $(document).ready(function () {
            bindDatatable();
        });
        function bindDatatable() {
            datatable = $('#tblStudent')
                .DataTable({
                    "sAjaxSource": "Plots/Postdata,
                    "bServerSide": true,
                    "bProcessing": true,
                    "type":"POST",
                     "datatype": "json",
                    "bSearchable": true,
                    "order": [[1, 'asc']],
                    "language": {
                        "emptyTable": "No record found.",
                        "processing":
                            '" style="color: rgba(42, 43, 43, 1)">Loading... '
                    },
                    "columns": [
                        {
                            "data": "plot",
                            "autoWidth": true,
                            "searchable": true
                        },
                        {
                            "data": "status",
                            "autoWidth": true,
                            "searchable": true
                        },
                        {
                            "data": "contractor",
                            "autoWidth": true,
                            "searchable": true
                        },
                        {
                            "data": "inspector",
                            "autoWidth": true,
                            "searchable": true
                        }, 
                    ]
                });
        }
    </script>

私が試したこと:

成功せずにさまざまなフォーラムで解決策を見つけようとしました

コメント

タイトルとURLをコピーしました