JQuery Datatable Entity FrameworkチェックボックスUPDATEデータベース

Question

DataTableの各行にチェックボックスを追加しました。ユーザーは承認をクリックする必要があり、「確認済み」の行のステータスが「承認済」に変更されている必要があります。これまでのところ、これはAJAXを使ってデータベースで動作します。しかし、私はテーブルのデータをリロードせずにVIEWのデータ値を変更したいと思います。

行[x]を変更するためのJavascriptを書く方法はありますか.status = CheckBoxをオンにしてからApproveボタンをクリックすると承認されますか？

enter code here  $(document).ready(function() { 

    var table = $('#provider_contracts').DataTable({ 
     "scrollX": true, 
     initComplete: function() { 

      this.api().columns([1, 2, 3, 5, 6, 7, 8, 9, 10, 11, 12]).every(function() { 
       var column = this; 
       var select = $('<select class="select_option" "><option value=""></option></select>') 
        .appendTo($(column.footer()).empty()) 
        .on('change', function() { 
         var val = $.fn.dataTable.util.escapeRegex(
          $(this).val() 
         ); 

         column 
          .search(val ? '^' + val + '$' : '', true, false) 
          .draw(); 
        }); 

       column.data().unique().sort().each(function (d, j) { 
        select.append('<option value="' + d + '">' + d + '</option>') 

       }); 
      }); 
     } 
    }); 


    $('#selectAll').click(function (e) { 
     if ($(this).hasClass('checkedAll')) { 

    $('input').prop('checked', false); 
     $(this).removeClass('checkedAll'); 

    } else { 
     $('input').prop('checked', true); 
     $(this).addClass('checkedAll'); 
     } 
    }); 

     var serviceURL = '/THPP-ConfigPortal/ProviderContracts/Index/'; 

     //$("#ID").submit(function() { 
      var tableName = "provider_contracts"; 
      $('#AjaxCall').click(function() { 
      $.ajax({   

      url: serviceURL, 
      contentType: "application/json; charset=utf-8", 

      success: function(result){ 
       $('#provider_contracts').find('input[type="checkbox"]:checked').each(function() { 

        $(this).closest('tr').find('td').eq(10).text('Approved'); 


       }); 
      } 

      //sucess:function() 
      //{ 
      // $('#provider_contracts').find('input[type="checkbox"]:checked').each(function() { 

      //  var item = $(this).val(); 

      //  alert(item); 
      // }); 
      //} 

       }); 

      }); 

     //});  

}); 
enter code here 

@model IEnumerable<WebApplication1.Models.thpp_Business_Config_Self_Service> 

<link href="~/Scripts/jquery.dataTables.min.css" rel="stylesheet" /> 
@using (Ajax.BeginForm("Index", "ProviderContracts", null, new AjaxOptions() 
{ 
    InsertionMode = InsertionMode.Replace 
}, new { id = "ID" })) 
{ 
    <p style="text-align:left"> 
     <input type="submit" id="AjaxCall" value="Approve" class="btn btn-default" /> 

    </p> 

    <br /> 
    <br /> 
    <table id="provider_contracts" class="display" cellspacing="0" width="100%"> 
     <thead> 
      <tr> 
       <th> 
        @Html.CheckBox("isApproved", false, new 
       { 
        @id = "selectAll" 
       }) 
       </th> 
       <th> 
        Internal_ID 
       </th> 
       <th> 
        Type 
       </th> 
       <th> 
        LOB 
       </th> 
       <th> 
        Description 
       </th> 
       <th> 
        Eff_Date 
       </th> 
       <th> 
        Term_Date 
       </th> 
       <th> 
        Fee_Sched 
       </th> 
       <th> 
        Percentage 
       </th> 
       <th> 
        Conversion 
       </th> 
       <th> 
        Status 
       </th> 
       <th> 
        Timely_Filing 
       </th> 
       <th> 
        Spec. 
       </th> 

       <th></th> 
      </tr> 
     </thead> 
     <tfoot> 

      <tr> 
       <th></th> 
       <th> 
        Internal_ID 
       </th> 
       <th> 
        Type 
       </th> 
       <th> 
        LOB 
       </th> 
       <th> 
        Description 
       </th> 
       <th> 
        Eff_Date 
       </th> 
       <th> 
        Term_Date 
       </th> 
       <th> 
        Fee_Sched 
       </th> 
       <th> 
        Percentage 
       </th> 
       <th> 
        Conversion 
       </th> 
       <th> 
        Status 
       </th> 
       <th> 
        Timely_Filing 
       </th> 
       <th> 
        Spec. 
       </th> 
       <th></th> 
      </tr> 
     </tfoot> 

     <tbody> 
      @foreach (var item in Model) 
      { 
       <tr> 

        @Html.HiddenFor(modelItem => item.Control) 

        <td class="selectAll"> 

         @Html.CheckBox("complete", false, new { @class = "complete", id = "complete[]", @value = item.Control }) 

        </td> 


        <td> 
         @Html.DisplayFor(modelItem => item.Internal_ID) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Type_Indicator) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.LOB) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Description) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Effective_Date) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Term_Date) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Fee_Sched) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Percentage) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Conversion) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Status) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Timely_Filing_Days) 
        </td> 
        <td> 
         @Html.DisplayFor(modelItem => item.Specialty) 
        </td> 

        <td> 

         <a href="@Url.Action("Edit/" + item.Control, "ProviderContracts") " class="modal-link btn btn-success"><span class="glyphicon glyphicon-pencil"></span></a> 
         <a href="@Url.Action("Create/", "ProviderContracts") " class="modal-link btn btn-success"><span class="glyphicon glyphicon-plus"></span></a> 
         <a href="@Url.Action("Delete/" + item.Control, "ProviderContracts") " class="modal-link btn btn-danger"><span class="glyphicon glyphicon-trash"></span></a> 


        </td> 
       </tr> 
      } 
     </tbody> 
    </table> 
} 

@Scripts.Render("~/bundles/jqueryval") 

<script src="~/Scripts/ProviderContracts.js"></script> 

Answer 1

var serviceURL = '/THPP-ConfigPortal/ProviderContracts/Index/'; 

      //$("#ID").submit(function() { 
       var tableName = "provider_contracts"; 
       $('#AjaxCall').click(function() { 
       $.ajax({   

       url: serviceURL, 
       contentType: "application/json; charset=utf-8", 

       success: function(result){ 
        $('#provider_contracts').find('input[type="checkbox"]:checked').each(function() { 

         $(this).closest('tr').find('td').eq(10).text('Approved'); 


        }); 
       }