Creating HTML links to automatically filter table data

Creating HTML links to automatically filter table data

jogilliverjogilliver Posts: 2Questions: 0Answers: 0
edited June 2013 in General
Hi,

I'm quite new to Javascript, so forgive me if this is a simple question.

I've got DataTables working on my site nicely but I want to set up a menu of HTML links to automatically filter the table data, e.g. one link would show rows that reference 'apples', another would show rows that reference 'oranges', etc.

This is how I'm initialising my table:

[code]

$(document).ready(function() {
var oTable = $('#example').dataTable( {
"iDisplayLength": 10,
"aLengthMenu": [[10, 20, -1], [10, 20, "All"]],
"aoColumnsDef": [
{ "sType": 'date-uk', "aTargets": [ 3 ] }
],
});
} );

[/code]

And this is how I'm linking to the filtered data:

[code]

[/code]

The table is initialising fine but no matter what I do, I get an Uncaught ReferenceError that oTable is not defined when I click the link.

Any advice would be -greatly- appreciated.

Jo.

Replies

  • allanallan Posts: 63,235Questions: 1Answers: 10,417 Site admin
    oTable is not a global variable - so that won't work. You could make it global and it would - that's the easiest option!

    However, I would strongly encourage you to use a jQuery click event rather than DOM0 events to attach a listener and fire it.

    Allan
  • jogilliverjogilliver Posts: 2Questions: 0Answers: 0
    Thanks, Allan. I've got it working now. I appreciate your help.

    Jo
This discussion has been closed.