TableTools repeated initialisation

TableTools repeated initialisation

basilbearbasilbear Posts: 10Questions: 0Answers: 0
edited November 2009 in General
Hello people,

I am experiencing a minor, but irritating problem with the TableTools feature, which I suspect is totally my fault!

I show a table, with the tools on display. Each row has an onclick event allowing a popup to appear with extra details for the row which was clicked.

Problem - every click adds an EXTRA TableTools div to the document.

So, what should I change to get this working so that there is only every ONE instance of TT in the document?

Best wishes

BasilBear

Replies

  • basilbearbasilbear Posts: 10Questions: 0Answers: 0
    Further ...

    I initiate the datatable like this:

    [code]
    $("#datatable").dataTable({
    "bLengthChange": true,
    "bPaginate": false,
    "bFilter": false,
    "bInfo": false,
    "sDom": 'T<"clear">lfrtip'
    });
    [/code]
  • izzy6150izzy6150 Posts: 49Questions: 0Answers: 0
    Hi basilbear,

    Can you post your click finction code and example table markup. or provide a link?

    Regards,
    Izzy
  • basilbearbasilbear Posts: 10Questions: 0Answers: 0
    Hi Izzy,

    thank you for responding. :)

    I call the dialog.open() method like so:

    [code]
    // Dialog Link
    $('#datatable tr').click(function(){
    $('#jobDetails').dialog('open');
    ... construct url var here ...
    $('#jobDetails').load(url);
    return false;
    });
    [/code]

    and the jobDetails dialog is defined like this:

    [code]
    // Dialog
    $('#jobDetails').dialog({
    autoOpen: false,
    modal: true,
    width: 800,
    buttons: {
    "OK": function() {
    $(this).dialog("close");
    },
    "Print": function() {
    $(this).jqprint();
    }
    }
    });

    [/code]

    I was previously using FACEBOX as instead of jquery.ui.dialog, with a different means of opening that, but with the same problem.

    Hope this helps. Thank you.
    BB.
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    Hi basilbear,

    Very odd indeed! I can't think of anything off the top of my head which would cause TableTools to enter another element onto the page. Looking at the code, something would need to be reinitialising it again for this to happen, and I don't believe DataTables will do this, unless you are re-initialising the table multiple times.

    Can you provide a link to a page showing a table with this specific problem? That would really help diagnosing the problem.

    Regards,
    Allan
  • basilbearbasilbear Posts: 10Questions: 0Answers: 0
    Hello Allan,

    unfortunately I cannot supply a link for the time being, because the app is based on a customer's system which requires secure access - I would be breaking confidentiality to provide you with access - pity. I understand that this places a big obstacle in the way of asking for help :(

    However, if I were able to put together some sample pages that demonstrate the problem, I could email them to you. Would you open to that idea?

    Best wishes

    BasilBear (Victor)
  • DunhamzzzDunhamzzz Posts: 11Questions: 0Answers: 0
    This happened to me when I was messing around with Ajax using the load() function.

    Are you replacing the original raw html of the table, or calling the fnDraw() at any point?
  • basilbearbasilbear Posts: 10Questions: 0Answers: 0
    Hi Allan,

    I think that Dunhamzzz has hit the nail on the head in suggesting that the problem here is related to the ajax call that I am making in order to populate the dialog which appears when a row is clicked.

    What I believe is happening, is that the code which surrounds my datatable definitions, namely:

    [code]
    jQuery(document).ready
    [/code]

    is being fired by the ajax response.

    I have demonstrated this by placing

    [code]
    alert('i am ready for you');
    [/code]

    just under the document.ready statement.

    So - any ideas on which way I should turn? I am a tad new to jquery, so not sure what alternative there is to using document.ready. I'm also wondering whether there is a means of suppressing the signal from the ajax call which is triggering the document.ready.

    Regards

    BasilBear
  • basilbearbasilbear Posts: 10Questions: 0Answers: 0
    RESOLVED.

    I've got it now.

    By placing this:

    [code]

    $(function(){
    $("#joblist").dataTable({
    "bLengthChange": false,
    "bPaginate": false,
    "bFilter": false,
    "bInfo": false,
    "sDom": 'T<"clear">lfrtip'
    });
    });

    [/code]

    in the specific page being loaded (within the head section), and leaving the rest of my jquery code in the js file under the document.ready statement, then the joblist datatable is only initialised when the page loads, rather than with the document.ready event which is re-triggered by Ajax calls.

    Thank you all for helping me to get there! A pot of "hunny" for you all.

    BasilBear.
This discussion has been closed.