Create multipe thead rows when using JS data

Create multipe thead rows when using JS data

fburleighfburleigh Posts: 3Questions: 0Answers: 0
edited April 2011 in General
My requirements are:

* dynamic data: that is, I'll supply DT its data through JS 2-dim array or maybe ajax.

* I need more control over what's in the thead. My use case needs more interaction options than sort and title. A more complete statistical characterization of the column and maybe some more interaction controls will be needed. I can also imagine inserting more html into the th's you create, but the second row is probably the better approach (for sanity, styling, etc).

* Hidden columns will be at play, I'll have to sort or otherwise alter the table based on hidden columns.

* Fixed columns will also be required, I think -- but I haven't gotten that far into it yet. ;-)

I've read several of the threads about "complex" heads (and footers) and conclude that 1.7.6 isn't quite ready for this set of requirements. Am I wrong? What about 1.8.0dev? For the moment, it's ok to be a little on the edge as long as basic functionality is not at much risk. So far, 1.8.0dev seems ok. Can you suggest some approaches for me to add the second thead row dynamically with jq?

I am also thinking about using a second table placed above the data table for my interactions, but think this may be sloppy and may introduce UI confusion.

Thanks, Allen.

Replies

  • allanallan Posts: 63,520Questions: 1Answers: 10,473 Site admin
    Hi fburleigh,

    1. 2D array - no problem there. That's the "native" data source for DataTables. 1.8 introduces features to be able to read information from objects if you need that as well.

    2. Thead control - if you need anything more complicated in the thead elements, than the automatically added 1 TH per column (and it's being generated dynamically by Javascript rather than being read from the DOM), you'll need to create this manually. The reason being is that there are just so many possible options for the header, that I think it would take quite a lot of code in the DataTables core - which typically wouldn't be used - to support. A more flexible option is for you, the developer, to be able to put whatever HTML you want into the table, and then initialise it. For example:

    [code]
    $('#example thead').html( '...whatever th cells are needed...' );
    // or to append another row
    $('#example thead').append( '...whatever th cells are needed...' );
    [/code]
    3. Hidden columns - for 'complex headers' with hidden columns, DataTables 1.8 would be required, since as you quite rightly point out, there is no support for this in DataTables 1.7. 1.8 is now virtually complete (minus one possible feature that I might add during beta), I'm just writing documentation for it now before releasing as beta which should be this week. It is stable in my testing and is passing all unit tests. Having said that, there is of course the possibility that there might be something I've overlooked, and I've not done any work on compatibility with the "extras" yet. Most of them should just work, but one or two might need a small tweak for certain features.

    4. FixedColumns - Cool :-). Personally I quite like that module!

    5. Second table - I'd say it depends on what sort of interactions you are thinking of? TableTools is useful for interactions such as add, edit and delete since you can just create custom buttons. But depending on the use case, there might well be a good reason to have a second table as a controller that would work well.

    Hope this helps! Let us know how you get on :-)

    Regards,
    Allan
This discussion has been closed.