0

私は jQuery プラグイン (Scroller 拡張機能を備えた DataTable) を使用してtableおり、遅延レンダリングのおかげで HTML を数千行表示できます。

私はそれを作りたいですsortable（ソート可能なjQuery-UIプラグインで）。

問題は、要素をドラッグしてはるか下にドロップしたい場合、最初nodesのテーブルが DOM から消え、新しいテーブルが表示されることです。そのため、ドラッグした要素をドロップできなくなりました。

例は長いテキストよりも優れています: http://jsfiddle.net/91dr6utg/

$(document).ready(function() {
    $('#example').DataTable( {
        data:           data,
        deferRender:    true,
        dom:            "frtiS",
        scrollY:        200,
        scrollCollapse: true
    } );
    
    $('#example tbody').sortable({
        helper: "clone",
        start: function (event, ui) {
            ui.item.appendTo($('#dragSave'));
            ui.helper.appendTo($('#dragSave'));
        },
    }).disableSelection();
});

var data = [ "A lot of datas !" ];
<table id="example" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>ID</th>
            <th>First name</th>
            <th>Last name</th>
            <th>ZIP / Post code</th>
            <th>Country</th>
        </tr>
    </thead>
</table>

<div id="dragSave"></div>
（jsfiddle.netで試してみてください。スニペットで許可するには行が多すぎます）

最初の要素をドラッグすると、90 番目の要素の後にドロップできません。

詳しくは ：

startドラッグした線が消えるのを防ぐ機能をしました。実際、元の要素がnodeDOM から削除されると、sortableプラグインはその要素を削除できなくなります (要素を認識できなくなります)。そのため、更新されないDOMの別のコンテナに移動します。

nodeこの関数を削除すると、オリジナルが約 50 行下に削除されることがわかります
=> これは DOM の再生成によるものですが
、要素を 90 行下まで削除することができます
=> 次の行がDOM、限界だ

4

1 に答える 1

0

sortable()を使用せずに を使用する方法を見つけましたdraggable()。

ここにあります：http://jsfiddle.net/2dtcy9bs/1/

于 2015-07-23T13:18:24.343 に答える