Datatable rowReordering предотвращает определенную строку - PullRequest
0 голосов
/ 13 января 2020

У меня есть простая DataTable, и я бы хотел, чтобы пользователь не перетаскивал последнюю строку в таблице (в данном случае Тест 6) и заранее добавил, чтобы он добавил любую строку после этой 6-й строки. Так что последний ряд всегда должен оставаться там как последний. Возможно ли что-нибудь подобное с их API? Или что мне делать?

Заранее спасибо!

HTML:

<table class="table table-hover" id="launch_cpa_table">
<thead class="bg-info">
    <th class="text-white">Step</th>
    <th class="text-white">Name</th>
    <th class="text-white">Gate</th>
</thead>
<tbody>
    <tr>
        <td>1</td>
        <td>Test 1</td>
        <td>Test 1</td>
    </tr>
     <tr>
        <td>2</td>
        <td>Test 2</td>
        <td>Test 2</td>
    </tr>
     <tr>
        <td>3</td>
        <td>Test 3</td>
        <td>Test 3</td>
    </tr> 
     <tr>
        <td>4</td>
        <td>Test 4</td>
        <td>Test 4</td>
    </tr> 
     <tr>
        <td>5</td>
        <td>Test 5</td>
        <td>Test 5</td>
    </tr> 
    <tr style = 'background : gray'>
        <td>6</td>
        <td>Test 6</td>
        <td>Test 6</td>
    </tr> 

</tbody>

JS:

 var launch_table = $('#launch_cpa_table').DataTable( {
    rowReorder: true,
    columnDefs: [
        { orderable: true, className: 'reorder', targets: [0] },
        { orderable: false, targets: '_all' }
    ],
    paging: false
} );

Скрипка Js ссылка: https://jsfiddle.net/5r6u7z02/

Ответы [ 2 ]

0 голосов
/ 13 января 2020
0 голосов
/ 13 января 2020

Вы можете использовать orderable: false в columnDefs, это поможет вам избежать этого row до drag. просто добавьте no-sort класс к вашему row

columnDefs: [{
    targets: 'no-sort',
    orderable: false
  }
],

Возможно, это не сработает на любой версии, но есть хитрое решение, используйте pointer-events: none

JSFiddle

...