• I am trying to sort the first column of my table by date – ascending.

    However, the dates are in the format dd.mm.yy and when I click ‘sort’ in the plugin, it sorts it as a number instead of a date.

    I know the data tables has the option to sort by date, but I am note sure what custom code I should use to get this to work.

    You can see my table online here: http://nvstudio.com.my/schedule/

    Thanks!

Viewing 15 replies - 1 through 15 (of 15 total)
  • Hi,

    the problem is not only the format of the date, but more that you have mixed several formats in your table.
    You can not have things like “03 & 04.02.2010” besides “01/11/2010”. The JavaScript simply does not know how to put those together and sort them.
    You should bring all entries to the same format, where “mm/dd/yyyy” is recommended. If you want a different format, you’ll need to load a plugin for the DataTables library into your site.

    Best wishes,
    Tobias

    Thread Starter lwliang1

    (@lwliang1)

    Hi Tobias,

    Thanks so much for the quick reply.

    Actually I was converting the dates to the format dd/mm/yyyy, would this make the dates sort properly once I change them all to the same format?

    Also, if I put 2 dates in the same cell, such as 21/04/2010, 22/04/2010 would it still be able to sort the date based on the first item in the cell?

    If not, how do I insert a plugin from DataTable into my site and which plugin would I use?

    Sorry for all the questions, just wanted to get the task done right.

    Thanks again for the help,

    -William

    Hi,

    no, dd/mm/yyyy will not work out of the box, only mm/dd/yyyy does, according to the DataTables documentation at http://www.datatables.net

    Also, having two dates in one cell will not work, as the type detection will not properly find a date (you could work around this with some custom code, I believe).

    To sort dd/mm/yyyy dates, you will need both of these:
    http://datatables.net/plug-ins/sorting#date_euro_full
    http://datatables.net/plug-ins/type-detection#uk_date

    To insert them into WP-Table Reloaded, you need to place them into a new .js file (e.g. date-sorting.js) which is added to the page using the wp_table_reloaded_js_frontend_command filter.
    For that, place the following code in a new plugin file (according to the instructions on WP-Table Reloaded Extensions on my website). Also, place the JavaScript file there.

    add_filter( 'wp_table_reloaded_js_frontend_command', 'wp_table_reloaded_date_sorting_js_command', 10, 7 );
    
    function wp_table_reloaded_date_sorting_js_command( $command, $table_id, $html_id, $tablesorter_script, $js_command, $parameters, $js_options ) {
    
        $js_url = plugins_url( 'date-sorting.js', __FILE__ );
        wp_register_script( 'wp-table-reloaded-date-sorting-js', $js_url, array( 'wp-table-reloaded-frontend-js' ), '1.0' );
        wp_print_scripts( 'wp-table-reloaded-date-sorting-js' );
    
        return $command;
    }

    Best wishes,
    Tobias

    Thread Starter lwliang1

    (@lwliang1)

    Hi Tobias,

    Sorry for the late reply. Thanks for giving the code above.

    Just a quick question, where do I put the date-sorting.js file? In the plugins directory or in the wp-reloaded plugin directory itself?

    I have already uploaded and activated wp-table-reloaded-extensions.php.

    Lastly, if all goes well, I just select ‘sort column A > ascending’ from the table options?

    Thanks!

    -William

    Hi William,

    the JavaScript file goes into the same folder as the wp-table-reloaded-extensions.php file. However (and that is important), both should NOT go into any existing plugin folder, so I recommend that you simply create a new folder (e.g. “wp-table-reloaded-extensions”) in your plugin directory.

    After that, the JavaScript sorting on the frontend (where your table is displayed) will sort correctly. However, this does not influence the sorting in the backend that you mentioned (the “sort column A > ascending”). This works independent from the JavaScript and there is no possibility at the moment to change the sorting there, to sort the dates as you wish.

    Best wishes,
    Tobias

    Sorry Tobias for bothering you but having:

    1)set up a wp-table-reloaded-extensions folder unter wp-content/plugins
    2) joined the date_euro_full and type-detection#uk_date

    [moderator note: snipped code, please use http://wordpress.pastebin.ca ]

    8) any help?

    Hi,

    can you maybe post your steps again in short and use the pastebin as the moderator suggests? (Posting your entire code here was too long for the forums.) Thanks!

    Regards,
    Tobias

    Simply said…
    following your instructions
    1)i set up js file (date-sorting.js) copying (in this order) sorting#date_euro_full and type-detection#uk_date in folder wp-tabel-preloaded-extensions in wp-content/plugins
    2) build up a wp-tale-reloaded-extensions.php, copying the code inside the template following your example in extensions page doc.
    3) plugin activaded
    4) the sorting order in my date column is still mm/dd/yyyy (note all the column header have theirs arrows, and the sorting functions are working), and also note i have 4-digit in yyyy
    5) i tried to join in date-sorting.js only the Andy MacMaster snippets, i.e. this one (instead of euro_full) and type-detection#uk_date

    jQuery.fn.dataTableExt.oSort[‘uk_date-asc’] = function(a,b) {
    var ukDatea = a.split(‘/’);
    var ukDateb = b.split(‘/’);

    var x = (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
    var y = (ukDateb[2] + ukDateb[1] + ukDateb[0]) * 1;

    return ((x < y) ? -1 : ((x > y) ? 1 : 0));
    };

    jQuery.fn.dataTableExt.oSort[‘uk_date-desc’] = function(a,b) {
    var ukDatea = a.split(‘/’);
    var ukDateb = b.split(‘/’);

    var x = (ukDatea[2] + ukDatea[1] + ukDatea[0]) * 1;
    var y = (ukDateb[2] + ukDateb[1] + ukDateb[0]) * 1;

    return ((x < y) ? 1 : ((x > y) ? -1 : 0));
    };

    ——————————————

    still having the same results (mm/dd/yyyy).
    Could be that these snippets dont work when YYYY?
    Any help?
    Franco

    Hi,

    thanks for the explanation.
    Unfortunately I’m not a real expert in JavaScript or the DataTables library (I’m not the developer, I just offer it with my plugin.)

    However, if you want, I’ll take a look at the site with the table, maybe I can spot a problem. Can you therefore provide a link to the page with the table, where the code is not working?

    Regards,
    Tobias

    Is there a way to enter the date for the sorting purposes, but, to display a fuller version such as Monday, July 30, 2011?

    Hi,

    yes, that should be possible, but it requires some advanced programming with DataTables. Basically, you would need another column, that is hidden, but that gets used by the sorting algorithm. Those options can be found here: http://datatables.net/usage/options

    Regards,
    Tobias

    Hi,

    Great plugin.

    I followed the instructions above to sort using UK/Euro date format dd/mm/yy. This worked fine.

    Then I tried adding your shortcode filtering extension using the instructions on http://tobias.baethge.com/2010/03/extension-6-showing-only-rows-that-match-a-filter/

    This caused me to lose the date sorting functionality. So, I removed the filtering extension code, but cannot get the UK/Euro date format sorting functionality back. I have even tried removing the WP-tables Reloaded plugin and Extended plugin and reinstalling, but no change.

    Any help would be good, thanks.

    Hi,

    I don’t really see how the filtering extension could have broken the sorting…

    Can you maybe post the URL to the page with the table?

    Regards,
    Tobias

    http://amtdesign.co.uk/wp/?page_id=577

    I have removed the filtering code from the extension.

    Hi,

    thanks for the link.

    I believe the problem is in your date-sorting.js.
    In the last function, you are checking for a European date format and then assign the type to be uk_date, in the line

    return 'uk_date';

    The type that you have defined for sorting is called date-euro however. So, if you change that line to

    return 'date-euro';

    it might work.

    If that does not help, I suggest that you ask in the DataTables forums at http://www.datatables.net, as the guys there are more proficient in debugging these problems with the DataTables library.

    Regards,
    Tobias

Viewing 15 replies - 1 through 15 (of 15 total)
  • The topic ‘WP-Table Reloaded Date Sort dd.mm.yy’ is closed to new replies.