Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

html写出来的table和js更新后的效果不一样(数据一样) #520

Open
weishengwen2 opened this issue Sep 1, 2020 · 1 comment
Open
Labels
Need More Message 表意不明,需要补充说明

Comments

@weishengwen2
Copy link

weishengwen2 commented Sep 1, 2020

<table id="permission2" class="table table-bordered membersTable">
                                <thead></thead>

                                <tbody>
                                    <tr>
                                            <td>name</td>
                                            <td style="padding:2px;"><div class="check"><span><input type="checkbox" class="input_check" name="objectId[]" id="{{ item.value_view }}" value="{{ item.value_view }}" {{ item.value_view_checked }} onClick="onUserCheck()"><label for="{{ item.value_view }}" style="margin-bottom: 0px;"/></span></div></td>
                                    </tr>
                                </tbody>
                            </table>
$('#permission1').DataTable({
                                "language": dataTablesLanguage,
                                serverSide: true,
                                stateSave: false,
                                stateDuration: 0,
                                "filter": false,
                                'paging':false,
                                'info':false,
                                'infoEmpty':false,
                                'zeroRecords':false,
                                "sortable": false,
                                ordering: false,
                                ajax: {
                                    type:"GET",
                                    url:"{{ urlFor('group.permissions')}}".replace(":id", data.node.id),
                                    dataType : "json",
                                    "data": function (d) {
                                        $.extend(d, {num:1});
                                        $.extend(d, {editGroupId:$('#editUserGroupId').val()});
                                    }
                                },
                                "columns": [
                                   {"data": "name"},
                                   {
                                       "data": "value_view",
                                       "sortable": false,
                                       "render": function (data, type, full, meta) {
                                           //console.log("data = " + JSON.stringify(full));
                                           var isCheck = full['value_view_checked'];
                                           $("#42_view").click(function () {
                                               needshowsplicing();
                                           });
                                           return '<div class="check"><span><input type="checkbox" class="input_check"' +isCheck+ ' name="objectId[]" id="'+data+'" value="' +data+ '" onClick="onUserCheck()"><label for="'+data+'" style="margin-bottom: 0px"/></span></div>';
                                           //console.log("u = " + '<thead></thead><tbody><tr><td>'+name+'</td><td style="padding:2px;height:22px"><div class="check"><span><input type="checkbox" class="input_check"' +isCheck+ ' name="objectId[]" id="'+data+'" value="' +data+ '" onClick="onUserCheck()"><label for="'+data+'" style="margin-bottom: 0px"/></span></div></td></tr></tbody>');
                                           //return '<td style="padding:2px;"><div class="check"><span><input type="checkbox" class="input_check"' +isCheck+ ' name="objectId[]" id="'+data+'" value="' +data+ '" onClick="onUserCheck()"><label for="'+data+'" style="margin-bottom: 0px"/></span></div></td>';
                                       }
                                   }
                                ]
                            });
@ssy341
Copy link
Owner

ssy341 commented Sep 3, 2020

@weishengwen2 这里需要注意到,DT采用的是缓存数据,当获取到数据后,DT会缓存到内部变量里,如果有不同的类型(正交数据),会分别存到不同的内部变量,比如排序,搜索等。
所以如果你要做更新表格数据的操作,你需要使用DT提供的api来操作,这样数据才能保持一致,因为通过jQuery更新表格数据,他只是更新了html,而DT的内部数据没有更新,所以再去获取的时候就会出现数据不一致。
如何更新DT的数据,参考:

@ssy341 ssy341 added the Need More Message 表意不明,需要补充说明 label Sep 7, 2020
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
Need More Message 表意不明,需要补充说明
Projects
None yet
Development

No branches or pull requests

2 participants