DataTables

markjo

I use hidden title sorting.
In my script code, when i only declare "aoColumns", sorting is ok.
Hidden title sorting works.
But when i change options of datatable my code becomes broken.
In the below code i commented out the problematic part.
When i uncomment that part my script becomes broken.
How can i fix it?
Thank you


<script type="text/javascript" id="js">

    jQuery.fn.dataTableExt.oSort['title-numeric-asc']  = function(a,b) {
        var x = a.match(/title="*(-?[0-9\.]+)/)[1];
        var y = b.match(/title="*(-?[0-9\.]+)/)[1];
        x = parseFloat( x );
        y = parseFloat( y );
        return ((x < y) ? -1 : ((x > y) ?  1 : 0));
    };

    jQuery.fn.dataTableExt.oSort['title-numeric-desc'] = function(a,b) {
        var x = a.match(/title="*(-?[0-9\.]+)/)[1];
        var y = b.match(/title="*(-?[0-9\.]+)/)[1];
        x = parseFloat( x );
        y = parseFloat( y );
        return ((x < y) ?  1 : ((x > y) ? -1 : 0));
    };

    $(document).ready(function() {

        $('#myid').dataTable(
            {
                "aoColumns": [
                    null,
                    null,
                    null,
                    { "sType": "title-numeric" },
                    null,
                    null,
                    null,
                    { "sType": "title-numeric" },
                    null,
                    null,
                    null
                ],

//              "bPaginate": true,
//              "sPaginationType": "full_numbers",
//              "bFilter": false,
//              "sDom": '<"top"iflp<"clear">>rt<"bottom"iflp<"clear">>',
//              "bStateSave": true,
//              "fnDrawCallback": updateTableFuncts(),

            }
        );



        runSomethings();

    } );


    function runSomethings() {
        alert("somethings changed "); }
    }




</script>

allan

Syntax errors on lines 4-5 and others. I'd suggest looking at the Javascript console in your web-browser.

Allan

markjo

Ow my bad :(
Thank you very much.

richierich

allan said: Syntax errors on lines 4-5 and others

What is the error? Can you please suggest the correct code.

I am trying to use title-numeric to sort some data as per the title field using your plugin. I have added { "sType": "title-numeric" } in the header and the corresponding code from http://datatables.net/plug-ins/sorting#how_to_type

I am having the following error "a.match(/title="*(-?[0-9\.]+)/) is null"

My code is similar to http://www.datatables.net/forums/discussion/4595/how-to-use-hidden-sorting-plug-in/p1

Anyways, attached is my code:

jQuery.fn.dataTableExt.oSort['title-numeric-asc']  = function(a,b) {
    var x = a.match(/title="*(-?[0-9]+)/)[1];
    var y = b.match(/title="*(-?[0-9]+)/)[1];
    x = parseFloat( x );
    y = parseFloat( y );
    return ((x < y) ? -1 : ((x > y) ?  1 : 0));
};
 
jQuery.fn.dataTableExt.oSort['title-numeric-desc'] = function(a,b) {
    var x = a.match(/title="*(-?[0-9]+)/)[1];
    var y = b.match(/title="*(-?[0-9]+)/)[1];
    x = parseFloat( x );
    y = parseFloat( y );
    return ((x < y) ?  1 : ((x > y) ? -1 : 0));
};

$(document).ready(function() {
  oTable = $('#example').dataTable({
    "aoColumns": [
                null,
                null,
                { "sType": "title-numeric" },
                { "sType": "title-numeric" },
                null,
                null
            ],
            "bJQueryUI": true,
    "sPaginationType": "full_numbers",
    "aaSorting": [ ] 
  });
});

Following are some demo values from my table:
<td bgcolor="#fefefe" title="-1"> </td>
<td bgcolor="#1a9850" title="-1.784793E-4"> </td>

I would really appreciate your help.

Thank You.

allan

@richierich - can you link to your page please? It looks like your code should be working. If a link isn't possible, the debugger might be useful (link below the reply box on this page).

Allan

richierich

"arimef" The unique code from the debugger.

The debugger seems helpful. I looked into the rows of the debugger Datatable and realised that the row seems to have no values, when infact there is data in the html file (not sure why this should happen).
Following is the actual row in the html file

<tr><td bgcolor="#fefefe" title="1"> </td><td bgcolor="#fefefe" title="1"> </td><td bgcolor="#fdae61" title="0.18518825"> </td><td bgcolor="#fefefe" title="1"> </td><td bgcolor="#fefefe" title="1"> </td><td><a href="http://www.broad.mit.edu/gsea/msigdb/cards/AAAGACA,MIR-511">AAAGACA,MIR-511</a></td></tr>

Following is what you see in the row 1 of the debugger datatable

["", "", "", "", "", "<a href=\"http://www.broad.mit.edu/gsea/msigdb/cards/AAAGACA,MIR-511\">AAAGACA,MIR-511</a>"]

P.S. (once I figure out how) I would eventually use title-numeric to sort the columns 1,2 and 5 also.

Thank You for your help.

allan

Looking at the table, I think you might be getting a Javascript error on your browser's console (since I don't think the hidden title numeric sorting plug-in copes with either empty strings or strings without a title tag (which your data appears to contain).

If you look at the Firebug / Inspector console, do you see an error being generated? I think that the sorting plug-in will need to be modified to cope with that.

Allan

allan

Ah!

<td bgcolor="#fefefe" title="1">

I just realised you were using the title in the TD tag. The sorting functions do not have access to the TD's attributes by default - they string process only the data _inside_ the cell.

What you need to do is use a custom data gatherer for the sort:
http://datatables.net/development/sorting#data_source
http://datatables.net/release-datatables/examples/plug-ins/dom_sort.html

Or put the numeric data inside the cell.

A limitation in the current implementation - sacrificing flexibility for speed...

Allan

richierich

Thanks for your reply.

put the numeric data inside the cell.

This definitely would not work due to html page becoming ugly. Numbers are only for sorting (numbers not to be shown in the cell)

use a custom data gatherer for the sort:

This might work. However, with my very limited knowledge of javascript I am not sure about how it can be done for my case. Can you please tell me what changes I need to make?

Your help is greatly appreciated. I can create a new thread if you want to answer this question completely separate from the above ones.

Thanks.

DataTables

Howdy, Stranger!

Support

Categories

In this Discussion