codegeekalpha Ответов: 2

Проблемы при загрузке таблиц данных из ASP.NET веб-API


Я пытаюсь выполнить поисковую фильтрацию и сортировку в веб-API с помощью библиотеки datatable js. Но на нагрузке ничего не видно.

Что я уже пробовал:

На Макете.Cshtml по
@Scripts.Render("~/bundles/lib")
    @RenderSection("scripts", required: false)
    
</body>


в связки.Конфиг

bundles.Add(new ScriptBundle("~/bundles/lib").Include(
                        "~/Scripts/jquery-{version}.js",
                        "~/Scripts/bootstrap.js",
                        "~/scripts/bootbox.js",
                        "~/Scripts/respond.js",
                        "~/scripts/datatables/jquery.datatables.js",
                        "~/scripts/datatables/datatables.bootstrap.js"
                      ));


в основном Index.html

<script>
       $(document).ready(function () {

           $("#customers").DataTable();



           $("#customers").on("click", ".js-delete", function () {
               var button = $(this);

               bootbox.confirm("Are you Sure you want to delete this customer?",function(result){

                   if(result){
                       $.ajax({

                           url: "/api/customers/" + button.attr("data-customer-id"),
                           method: "DELETE",
                           success: function () {
                               button.parents("tr").remove();



                           }



                       });

                   }
               });


           });


       });


   </script>

Nathan Minier

На самом деле вы не получаете никаких данных для заполнения таблицы. Все, что у вас есть здесь, - это метод удаления.

j snooze

Согласен с Натаном. Также вам нужен html-объект с идентификатором "customers" (по вашей ссылке в javascript). Я не вижу этого в index.html файл тоже.

2 Ответов

Рейтинг:
1

sonymon mishra

You Question is incomplete. You have asked for populating the records from WebApi to jQuery DataTable, But writing cde for deleting a row fro the DataTable.
The following code may work for pupulating the data (assuming Col1 and Col2 are two cloumns for the DataTable)


$("#customers").DataTable({
      serverSide: true,
      processing: true,
      columns : [
          { data : 'Col1' },
          { data : 'Col2' }
      ],    
      ajax: {
          url: /api/customers/" + button.attr("data-customer-id"),
          dataSrc : ''
      }
});


Рейтинг:
1

fatihkaratay

DataTables requires a well-formed table. It must contain <thead> and <tbody> tags, otherwise it throws this error. Also, make sure that you have the same amount of <td> in your project.