jQuery Datatable始终仅显示初始检查或取消检查的值 [英] Jquery Datatable alway showing the initially checked or uncheck values only

问题描述

我的情况与问题类似

数据表无法将excel中更新的复选框值导出为0或1，始终仅显示初始检查的值

我有一个jQuery数据表，从服务器端的绑定到显示数据，一切正常，但是我需要将数据表从我的剃须刀页面提交到另一个控制器.因此，我需要选中的行和非选中的行以及它们的ID，因此，当我向控制器提交数据表中的所有数据时，除了复选框值未更新之外，它们的初始值都已被发送，即使它们的初始值也已发送，即使我选中或取消选中它们，只得到它们在第一次绑定时从服务器获得的初始值

I have a jQuery datatable and every thing is going alright from binding on the server side to showing data, but I need to submit the datatable from my razor page to another controller. So, I need the checked rows and non checked rows as well with their ids, so when I submit to controller all data in datatable are submitted well except the checkboxes values are not being updated ,they have been sent with their initial values ,even if I checked or unchecked them , I got only the initial value they got from the server on first bind

@section scripts {
    <script>
        var obj = @Html.Raw(Json.Serialize(Model));

        var storeId = document.getElementById('idStore').value;
        
        var tableParam;
        $(document).ready(function () {
         $('#myTable').DataTable({
            "proccessing": true,
            "serverSide": true,
            "ajax": {
                url: "/item/loaddata",
                type: 'POST',
                headers: { 'RequestVerificationToken': $('@Html.AntiForgeryToken()').val() },
                data: { "StoreId": storeId }
             },
             "columnDefs": [
                 {
                     "targets": 0,
                     "checkboxes": {
                         "selectRow": true
                     },
                 }
             ],
             "select": {
                 "style": "multi"
             },
            "columns": [


                {
                      "data": "selected", "searchable": false, "render": function (data, type, row) {
                         
                            return '<input type="checkbox" class="chk"' + (data ? ' checked' : '') + '/>';
                    }
                },

                {"name":"SNumber", "data": "tname"},
                { "name": "MName", "data": "lname" },
                { "name": "SGuid", "data": "itemguid", "visible": false, "searchable": false },



            ],
            "order": [[0, "desc"]]
        });


        });


       
        
            
    </script>

    <script type="text/javascript">


        $(document).on("click", "#btnSave", function (e) {
              var table = $('#myTable').DataTable();
 
            var datac = table.rows(function (idx, data, node) {
                return $(node);
            }).data().toArray();

             
                 
             
            $.ajax({
                url: "/inventory/saveselecteditems",
                type: 'post'
               , data: { "testmodel": datac }

            });



        });

       
    </script>



}

推荐答案

数据表具有内置功能来获取选定的行.

Datatable has a built-in function to get the selected rows.

table.rows({ selected: true }).data().toArray();

按如下所示进行更改:

$(document).on("click", "#btnSave", function (e) {
        var table = $('#myTable').DataTable();
        var datac = table.rows({ selected: true }).data().toArray();  
        $.ajax({
            url: "/inventory/saveselecteditems",
            type: 'post', 
            data: { "testmodel": datac }
        });
});

更新:

<script type="text/javascript">
    $(document).on("click", "#btnSave", function (e) {
        var table = $('#myTable').DataTable();
        var datac = table.rows(function (idx, data, node) {
            var chk = $(node).find("input:checkbox");
            if ($(chk).is(':checked')) {
                data.selected = true;
            } else {
                data.selected = false;
            }
            return $(node);
        }).data().toArray();
        $.ajax({
            url: "/inventory/saveselecteditems",
            type: 'post',
            data: { "testmodel": datac }

        });
    });
</script>

这篇关于jQuery Datatable始终仅显示初始检查或取消检查的值的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！