Question

Hoping someone can give me a hand here….

I have the DataTables jquery plugin set up to return HTML within the json data coming back from the server. An example of a row’s data looks like this:

["<input type='checkbox' id='2' />","<img src='images/playbtn.png' width='24' height='24' /><a href='javascript:void(0)' onClick='openDialog(0)'>oK5ktqWTOsiyP5wH75tFj2yIY8XprWOwB</a>","11/18/2010 08:16:28 PM","juan j","juan j","incoming","00:02:38","","<img src='images/share.png' class='tableimage' title='Share Call With Friends' /> <img src='images/download.png' class='tableimage' title='Download Call' /> <img src='images/page_edit.png' class='tableimage' title='Edit Call Info' /> <img src='images/trash.gif' class='tableimage' title='Delete Call' />"]

The display is working just fine and all the data is coming back nicely.

The purpose of the first tag is to open a jquery dialog window. I have set the jquery properly and I know that it is written correctly. However my problem is that when I click on the link within the cell of the DataTable nothing happens and I see “Security error” code: “1000” in firebug, the alert that I put in the function is not even firing. I do not know what this error means but at first I thought that it was a result of having a lot of div’s on the page but I then made a quick example of a page with only the grid on it and the div that is meant to come up as the dialog box..that too did not work. Does anyone know why this kind of error would be triggered by the DataTable?

Thanks!

Answer 1

I don’t know why you’re getting this security error code, but one thing you can try instead of adding inline JavaScript inside the table cell is to attach a click event handler on the table and use event delegation to handle the event. Here’s an example:

$('table').delegate('a', 'click', function(e) {

    openDialog(0);

    // note: 'this' is the 'a' DOM element, so you can do additional things with it.  For example:
    var $a = $(this);
    var href = $a.attr('href');
    // now do something with href

});

I’ve been using this technique with DataTables and it works well.