DataTables
Advanced interaction
features for your tables.
Editor
Comprehensive editing
library for DataTables.
Manual
Download
≡ Show site navigation

Conditional sorting

Conditional sorting

arnorbldarnorbld Posts: 123Questions: 23Answers: 1
in DataTables 1.10

Hi guys,

I have a table that displays folders and files from Google Drive, retrieved via Google API. For example:

At the top is a link to the parent folder (if there is one and the user has access to it) and then a list of folders in alphabetical order and then a list of files.

Ideally, I would like to leave the parent link row and the folder rows UNSORTED when sorting, no matter what column was being sorted on (I have a column for size, modified date and upload date)

When sorted, this gets really confusing with the folder and files all mixed in as well as the parent folder link.

Is there any way to basically exclude rows from the sort so they always show up at the top on the first page?

Or any other clever method to prevent these folder rows from sorting into a hot mess with the files?

Best regards,

Answers

  • arnorbldarnorbld Posts: 123Questions: 23Answers: 1

    Hi guys,
    Picked the wrong screenshot, the one in the post shows how it sorts, this one shows how it looks like after it loads initially:

    The file names inside the red box should sort, the folders on top should not,

    I sure would appreciate any help you can provide on this one! :)

    Best regards,

  • kthorngrenkthorngren Posts: 21,344Questions: 26Answers: 4,954

    The best way to get help is to provide a simple test case that has an example your data. Maybe a test case that replicates the screenshot. This way we know exactly what you have to provide more specific suggestions.
    https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

    Some options are:

    1. Create a sorting plugin.
    2. Use orthogonal data.
    3. Use the RowGroup extension to group by folders and files and sort within the groups.

    Kevin

  • allanallan Posts: 63,535Questions: 1Answers: 10,475 Site admin

    In addition to that, you can use the order.neutral() plug-in to remove ordering from the DataTable (and thus display it in the originally loaded order).

    Allan

  • arnorbldarnorbld Posts: 123Questions: 23Answers: 1

    Hi guys,

    Thanks so much for responding! I will set up a test case for you so you can play with it!

    Best regards,

  • arnorbldarnorbld Posts: 123Questions: 23Answers: 1

    Hi guys,

    I've copied the table, removed the links which relate to my local machine and cleaned it up a bit. It shows the problem described. See http://live.datatables.net/sosirida/1/edit

    In a perfect world I need:
    1. The "Up to parent folder" (identified with "parent-row" class) to always stay at the top of the first page.
    2. The folders (identified with "folder-row" class) all under the "Up to parent folder" sorted by or identical to the natural-nohtml plugin.
    3. The files (identified with "file-row" class) last and can be sorted by name, size, modified, and uploaded.

    Note that the "Up to parent folder" may not appear in the list if the user cannot navigate up. In that case the folders should always be at the top and the folders at the bottom, sortable.

    Best regards,

  • allanallan Posts: 63,535Questions: 1Answers: 10,475 Site admin

    The "Up to parent folder" (identified with "parent-row" class) to always stay at the top of the first page.

    Have a look at this blog post which described a plug-in which can be used for that.

    The folders (identified with "folder-row" class) all under the "Up to parent folder" sorted by or identical to the natural-nohtml plugin.

    You'd need to rewrite the absolute positioning sorting and natural sorting plug-ins to basically merge the two together. The two cannot be used at the same time on the same column.

    Perhaps a possible way to overcome the need to do that, is to use the draw event and each time it happens inject the Up to parent folder row at the top of the tbody.

    Allan

  • arnorbldarnorbld Posts: 123Questions: 23Answers: 1

    Hi guys,

    I think I could use the absolute plugin for both - I'll figure that out later.

    But I'm not sure how to set up the condition. Since these are folder names there is no way to use the data inside the TD as an indication/filter. All that I have is the class that separates the file and folder links and the name of the icon file used in column 2. For example:

    var nameType = $.fn.dataTable.absoluteOrder( 'Unknown' );
 
$('#myTable').DataTable( {
    columnDefs: [
        { targets: 0, type: nameType }
    ]
} );

    How can I set up the nameType to check for a class on the TR tag?

    I have tried this using a fixed name of an icon that is used for the folders - it did not work:

        jQuery(document).ready( function () {

        var folderType = jQuery.fn.dataTable.absoluteOrder( 'folder-gray.png' );

        jQuery('#filetable')
            .addClass( 'nowrap' )
            .dataTable( {
                "pageLength": g_DTRowsPerPage,
                responsive: true,
                columnDefs: [
                    //{type: 'natural-nohtml', targets: 2},
                    { targets: [-1, -3], className: 'dt-body-right' },
                    { targets: 2, type: folderType }
                ],
                columns: [{"orderable" : false}, null, null, null, null, null],
                "order": [],
                "oLanguage": {
                    "sSearch": "Filter:"
                }
            } );
    } );

    I tried to add the word "Folder" to the second column and set the absoluteOrder to use that, but it did not work either. The order was the same as before. So I'm missing something.

    I'm using the CDN URL to load it. I'm using jQuery rather than $ as this is inside a Joomla component and Joomla seems to like jQuery better.

    Best regards and have a great weekend!
    Arnor

  • arnorbldarnorbld Posts: 123Questions: 23Answers: 1

    Hi guys,

    I tried using a filter for blank:

    var folderType = jQuery.fn.dataTable.absoluteOrder( '' );

    and adjusted the column target:

    { targets: 4, type: folderType }

    Since the Modified and Updated columns are blank for the folders, that would have been an easy filter, but it still sorts the same way as without the plugin.

    Best regards,
    Arnor

  • kthorngrenkthorngren Posts: 21,344Questions: 26Answers: 4,954
    edited August 2021

    Is it possible for you to add another column which will server as a grouping column. The column can be hidden but used as part of the sort function. See this example:
    http://live.datatables.net/yuyawubu/1/edit

    I added a column, after the filename column, that is a grouping using 0, 1 or 2. The columns.orderData option is used to first order by the "grouping" column then by the filename column. It uses the absolute plugin to force 0 to the top and 2 to the bottom.

    Kevin

  • arnorbldarnorbld Posts: 123Questions: 23Answers: 1

    Hi Kevin,

    Thanks! Yes, I should be able to do that! Will let you know how it works!

    Best regards,

  • arnorbldarnorbld Posts: 123Questions: 23Answers: 1

    Hi Kevin,

    I got this to work - mostly<g> I would like the folders to NOT sort at all when the "Name" column header is clicked. Is there any way to make that happen? If not, this is a big improvement to have the folders at the top!

    Thank you guys for all your help!

    Best regards,

  • kthorngrenkthorngren Posts: 21,344Questions: 26Answers: 4,954

    See if orderFixed (orderFixed: [[3, 'asc']],) helps, like this:
    http://live.datatables.net/yuyawubu/4/edit

    Kevin

Sign In or Register to comment.

DataTables

DataTables designed and created by SpryMedia Ltd.
© 2007-2023 MIT licensed. Privacy policy. Supporters.
SpryMedia Ltd is registered in Scotland, company no. SC456502.