Datatable rowReordering prevent certain row

Datatable rowReordering prevent certain row

djokicdjokic Posts: 4Questions: 1Answers: 0

I have simple DataTable and i would like to prevent user to drag last row in table (in this case Test 6) and to prevet him to add any row after that 6th row. So last row should always remain there as last. Is anything like this possible with their API ? Or what should i do?

Thanks in advance!

HTML:

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
} );

FiddleJs link: https://jsfiddle.net/5r6u7z02/

This question has accepted answers - jump to:

Answers

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,736

    See this recent thread discussing the same question.

    Kevin

  • djokicdjokic Posts: 4Questions: 1Answers: 0

    @kthorngren Thanks for your reply mate but this is not really what i need. In all this examples i can drag any row after last one. In my case i need test 6 to ALWAYS be last row, no matter what you are dragging bellow it.

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,736
    edited January 2020 Answer ✓

    Did you read through the thread and try my last example? The last example keeps "Garrett Winters" at the bottom. Could be that you are able to move a row below Garrett. If so let me know the steps.

    However if this is not what you want then my suggestion is to remove Test 6 from the table and place it in the footer. There is no builtin functionality to keep specified rows at the bottom when using RowReorder.

    Kevin

  • djokicdjokic Posts: 4Questions: 1Answers: 0
    edited January 2020

    Yeah i can see that and that is exactly what i need. Its weird that when i try to implement your code I got an error :

    TypeError: $.fn.dataTable.absoluteOrderNumber is not a function. (In '$.fn.dataTable.absoluteOrderNumber( [
        { value: -1, position: 'bottom' }
    ] )', '$.fn.dataTable.absoluteOrderNumber' is undefined)
    

    @kthorngren

  • kthorngrenkthorngren Posts: 20,141Questions: 26Answers: 4,736
    Answer ✓

    As noted in the thread you need to install and use this plugin:
    https://datatables.net/blog/2016-12-22

    Kevin

  • djokicdjokic Posts: 4Questions: 1Answers: 0

    @kthorngren i just figured it all out thanks to your post !

    THanks so much mate!!!

This discussion has been closed.