Add Custom Behavior to All Datatables

Add Custom Behavior to All Datatables

JamesLaiJamesLai Posts: 6Questions: 0Answers: 0
edited August 2011 in General
We'd like to extend Datatables to include our own custom functionality without worrying about initializing it on every DataTable declaration. A couple minor examples include storing the sorting information (when it occurs) in our own object, performing custom behavior when the datatable is waiting on a request from the server, and even implementing the fnSetFilteringDelay globally without needing to call it for each datatable declaration.

Is there a general way of accomplishing this or do these functions need to generally call and append their native functions? Thanks again!

Replies

  • fbasfbas Posts: 1,094Questions: 4Answers: 0
    yes. read the plugins and development pages.
  • JamesLaiJamesLai Posts: 6Questions: 0Answers: 0
    @fbas: I have. Extensively. Most of the plugins and development pages don't accomplish what I'm looking to accomplish. For example, on the plugins page we have a lot of native areas where we can plug in additional methods, but only for areas where new methods are expected. For example, I can define a new sorting, pagination or type detection method. However, this doesn't address the problem of creating wholly new functionality in various areas. As in my example, this would include events hooked into sorting (and not defining a new sorting method itself) and/or including new methods when certain events occur (such as requesting more data from the server side).

    The development area outlines ways to extend datatables in a "safe" manner, allowing myself to define new methods within the $.fn.dataTableExt object (and usually the $.fn.dataTableExt.oApi object) which I can later call when I define a datatable. However, I'd like to hook this functionality into each datatable without needing to explicitly call the method as we have dozens of datatables, and I'd hate to need to do something akin to this on every declaration:

    $().dataTable()
    .something()
    .anotherMethod()
    .moreBehaviors()
    .evenMoreBehaviors()

    Overall I'd like to know if there's a nice, general way of extending functionality without needing to do this. Thanks!
  • fbasfbas Posts: 1,094Questions: 4Answers: 0
    edited August 2011
    dataTable() is just an exension function (plugin) in jquery, which returns a jquery object.

    [code]
    oTable = $('#example').dataTable().fnSettings(); // <-- calling an API function

    oTable = $('#example').dataTable().find('tr'); // <-- calling a jquery function, chained onto datatables
    [/code]

    anything you code as a jquery plugin will be chainable to it. anything you code into the api can be tacked onto the end. if you want it to be a link in the chain for other functions to be tacked onto it, you just need to return jquery objects.

    http://docs.jquery.com/Plugins/Authoring
  • fbasfbas Posts: 1,094Questions: 4Answers: 0
    I should point out that returning a jquery object is easy: return oSettings.oInstance (jquery wrapper around the TABLE dom element)

    all API functions get oSettings passed to it as the first argument.

    if you're not using a formal extension API function, easily get the settings object and the oInstance variable:
    [code]
    $('#example').fnSettings().oInstance;
    [/code]

    or maybe you already kept a variable reference to oTable.
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    You might also be interested in this blog post: http://datatables.net/blog/Creating_feature_plug-ins . It describes how feature plug-ins can be created and you can use that to perform operations similar to how:

    $().dataTable()
    .something()
    .anotherMethod()

    would work.

    Having said that you would need to use sDom to activate these features - but you could possibly share that between all tables. There isn't a way to have a plug-in feature invoked automatically (sorting can be through the type detection, but features can't). For that a little bit of custom code would be required in DataTables.

    Allan
  • JamesLaiJamesLai Posts: 6Questions: 0Answers: 0
    $().dataTable()
    .something()
    .anotherMethod()

    ...is exactly what I do *not* want, as it would mean maintaining these definitions over dozens of pages. It seems like jQuery Datatables cannot be extended like some of the popular jQuery widgets. Shame - thanks anyhow!
  • allanallan Posts: 63,523Questions: 1Answers: 10,473 Site admin
    Well as I said you could use feature plug-ins like that described in the blog post to avoid chaining class methods like you have there. As I noted these need to be initialised using sDom, which you could easily have a default value for shared between your tables or modify the source slightly. Anternatively, it would be fairly tirvial to have feature plug-ins self-initialise with a little bit of code added to the core.

    Allan
  • JamesLaiJamesLai Posts: 6Questions: 0Answers: 0
    Here's perhaps a better example that might really demonstrate what I'm trying to accomplish. I'd like to tie in some custom behavior with the _fnProcessingDisplay function. Whenever datatables is going to run _fnProcessingDisplay, I'd like to run some other custom code on the page. Now, as far as I can see using a plug-in isn't going to help, as while I can certainly create a new method within oApi, calling it remains my responsibility. I'd like to piggyback on the existing _fnProcessingDisplay call, since it's already being called in the situations I'd want to do this custom method.

    Is there a good, safe way of doing this (obviously outside of editing jQuery.dataTables.js itself, which breaks our ability to easily update)? Thanks again!
This discussion has been closed.