Jquery Редактор данных Создать Редактировать Удалить используя Asp. net веб-форму

Question

var editor;
$(document).ready(function() {
  var Pkid = ? ;
  var Code = ? ;
  var Name = ? ;
  editor = new $.fn.dataTable.Editor({
    ajax: {
      create: {
        type: 'POST',
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        data: '{Pkid: "' + Pkid + '",Code: "' + Code + '",Name: "' + Name + '"}',
        url: "DataTableAdd.aspx/save",
        success: function(response) {
          console.log(response);
        },
        error: function(response) {
          alert(response.statusText);
        }
      },
      edit: {
        type: 'POST',
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        data: '{Pkid: "' + Pkid + '",Code: "' + Code + '",Name: "' + Name + '"}',
        url: "DataTableAdd.aspx/save",
        success: function(response) {
          console.log(response);
        },
        error: function(response) {
          alert(response.statusText);
        }
      },
      delete: {
        type: 'POST',
        dataType: "json",
        contentType: "application/json; charset=utf-8",
        data: '{Pkid: "' + Pkid + '",Code: "' + Code + '",Name: "' + Name + '"}',
        url: "DataTableAdd.aspx/save",
        success: function(response) {
          console.log(response);
        },
        error: function(response) {
          alert(response.statusText);
        }
      },
    },
    table: "#studentTable",
    idSrc: 'pkid',
    fields: [{
      label: "Code:",
      name: "Code"
    }, {
      label: "Name:",
      name: "Name"
    }]
  });

  datatable();

});


function datatable() {
  var SearchType = "0";
  var SearchValue = "";
  $.ajax({
    type: "POST",
    dataType: "json",
    contentType: "application/json; charset=utf-8",
    data: '{SearchType: "' + SearchType + '",SearchValue: "' + SearchValue + '"}',
    url: "DataTableAdd.aspx/GetStudents",
    success: function(response) {
      $('#studentTable').DataTable({
        dom: "Bfrtip",
        data: JSON.parse(response.d),
        columns: [{
            'data': 'pkid'
          },
          {
            'data': 'Code'
          },
          {
            'data': 'Name'
          }
        ],
        select: true,
        buttons: [{
            extend: "create",
            editor: editor
          },
          {
            extend: "edit",
            editor: editor
          },
          {
            extend: "remove",
            editor: editor
          }
        ]
      });
    },
    error: function(response) {
      alert(response.d);
    }
  });
}

<script src="Scripts/jquery-3.3.1.js"></script>
<script type="text/javascript" src="Scripts/datatables.min.js"></script>
<link rel="stylesheet" type="text/css" href="Styles/datatables.min.css" />
<script src="Scripts/dataTables.editor.js"></script>
<link rel="stylesheet" type="text/css" href="Styles/editor.dataTables.min.css" />

<table id="studentTable" class="display">
  <thead>
    <tr>
      <th>pkid</th>
      <th>Code</th>
      <th>Name</th>
    </tr>
  </thead>
</table>

• В редакторе ajax как получить значения pkid, code, name.
• I я использую редактор в первый раз, так что есть что-то, что мне не хватает?
• Формат редактора ajax для создания, редактирования и удаления правильный или нет?.
• Я пробовал все, но При нажатии кнопки обновления отображается внутренняя ошибка, я не могу получить никаких идей.
• Помогите мне с JQuery редактором данных, пожалуйста.

Answer 1

• Изменения в функции редактора

var editor;
        $(document).ready(function () {
            editor = new $.fn.dataTable.Editor({
                //ajax: ,
                table: "#studentTable",
                idSrc: 'pkid',
                fields: [{
                    label: "Code:",
                    name: "Code"
                }, {
                    label: "Name:",
                    name: "Name"
                }
                ]
            });
            datatable();
        });

• Добавьте этот код для создания, редактирования и удаления функций

$(function () {
            editor.on('create', function (e, json, data) {
                var Pkid = data.pkid;
                var Code = data.Code;
                var Name = data.Name;
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    data: '{Pkid: "' + Pkid + '",Code: "' + Code + '",Name: "' + Name + '"}',
                    url: "DataTableAdd.aspx/save",
                    contentType: "application/json; charset=utf-8",
                    success: function (response) {
                        datatable();
                    },
                    error: function (response) {
                        alert(response.statusText);
                    }
                });
            });

            editor.on('edit', function (e, json, data) {
                var Pkid = data.pkid;
                var Code = data.Code;
                var Name = data.Name;
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    data: '{Pkid: "' + Pkid + '",Code: "' + Code + '",Name: "' + Name + '"}',
                    url: "DataTableAdd.aspx/save",
                    contentType: "application/json; charset=utf-8",
                    success: function (response) {
                        datatable();
                    },
                    error: function (response) {
                        alert(response.statusText);
                    }
                });
            });

            editor.on('remove', function (e, json, data) {
                var Pkid = data[0];
                var Code = "";
                var Name = "";
                $.ajax({
                    type: "POST",
                    dataType: "json",
                    data: '{Pkid: "' + Pkid + '",Code: "' + Code + '",Name: "' + Name + '"}',
                    url: "DataTableAdd.aspx/save",
                    contentType: "application/json; charset=utf-8",
                    success: function (response) {
                        datatable();
                    },
                    error: function (response) {
                        alert(response.statusText);
                    }
                });
            });
        });