JDataTable - sDom option - how to? 14 Years, 7 Months ago
|
Karma: 0
|
Hi There,
Firstly, I just purchased Smart Content DataTable Pack and really... GREAT work! I had never needed to do this sort of thing on a joomla site, looked around a bit and I am really happy I found you guys - especially as you're not listed on the JED. I wont have to spend that time looking if I need to do this for another site!
I have managed to get the table I wanted up and running really well, worked out UI themes etc, but there is one thing that I have not been able to work out. ( so far : )
In the notes for JDataTable it talks about "sDom" as an option/plugin parameter.
sDom - Allows you to specify exactly where in the DOM you want DataTables to inject the various controls it adds to the page (for example you might want the pagination controls at the top of the table). DIV elements (with or without a custom class) can also be added to aid styling
I have looked, and searched the forum but I cant find any information on how to work with this option. Can you directly to any documentation, any 'real' examples, or can you help me work out what I am doing.
The initial thing I want to do is more the pagination to the top of the table, but I am interested in what else I might be able to do.
One other slightly off topic question is more is a 'is this possible' question. I would like to - but it is not critical - to add a filter 'drop section' to inividual columns. I have seen this in examples of other js table sort scripts/systems. As an example, I am looking to have a list with one column for Suburb, and one column for state, and have a form drop selection box that allow the user to select to filter by for example - state - from the drop down. I hope that makes sence... as I said, it is not vital, but would be good to know if it can be dont and if it is.. how.
Many thanks in advance.
|
|
|
|
|
Re:JDataTable - sDom option - how to? 14 Years, 7 Months ago
|
Karma: 760
|
Hello,
Thank you for choosing our extension. Regarding your questions:
1. 'sDom' parameter allows you to specify exactly where in the DOM you want DataTables to inject the various controls it adds to the page (for example you might want the pagination controls at the top of the table). The follow syntax is used:
The following options are allowed:
'l' - Length changing
'f' - Filtering input
't' - The table!
'i' - Information
'p' - Pagination
'r' - pRocessing
The following constants are allowed:
'H' - jQueryUI theme "header" classes ('fg-toolbar ui-widget-header ui-corner-tl ui-corner-tr ui-helper-clearfix')
'F' - jQueryUI theme "footer" classes ('fg-toolbar ui-widget-header ui-corner-bl ui-corner-br ui-helper-clearfix')
2. Unfortunately 'ARI JDataTable' plugin doesn't provide possibility to create filters for specific columns.
Regards,
ARI Soft
|
|
|
|
|
Re:JDataTable - sDom option - how to? 14 Years, 7 Months ago
|
Karma: 0
|
Thank you for getting back to me so quickly.
I am sorry to ask for more information, but I am unsure of how to actually put the the parameter together.
My current plugin code is:
{arijdatatable bPaginate="true" customPagination="20,30,50,100"}
{aricsvtable file="media/momentum/stockists.csv"}
{aricsvtablecolumns}
{aricsvtablecolumn id="Stockists" alias="Stockists" width="20%" headerClassName="head"}
{aricsvtablecolumn id="Suburb" alias="Suburb" headerClassName="head"}
{aricsvtablecolumn id="State" alias="State" headerClassName="head"}
{/aricsvtablecolumn}
{/aricsvtablecolumns}
{/aricsvtable}
{/arijdatatable}
Where and how do I add the sDom parameter for example to move the pagination to the top right corner?
Is it sDom="p"? sDom="pH"? p="ui-corner-tr" etc.. How do I mix the par. and the constants?
I am sorry if I am being really dumb here, but I just dont get it.
Thank you.
|
|
|
Last Edit: 2010/05/14 12:01 By status101.
|
|
Re:JDataTable - sDom option - how to? 14 Years, 7 Months ago
|
Karma: 760
|
This parameter is used as attribute of {arijdatatable} tag. For example {arijdatatable sDom="frltip"}, but one note, use this parameter if you have knowledge of HTML and CSS because if you want to change layout of data table, it requires adjustment of data table styles.
Regards,
ARI Soft
|
|
|
|
|
Re:JDataTable - sDom option - how to? 14 Years, 7 Months ago
|
Karma: 0
|
Ok I got that bit, thank you for being patient with me.
I have played around with the sDom="frltip". Things before the table (t) go in the header, and things after the table go to the footer.. I am ok with my css and I understand that I would have to change the layout / floats etc. to get exactly that I want ( float pagination left etc.. ) I have had a play with it, and can move things around, but I do compleatly look the Jquery UI side of things.
I think this is lined to the 'constants' side of things you mentioned but I cant work out what/where these are used. Where do the constants come into it?
When I use the sDom, all the Jquery UI wrap elements seem to disapear.. I tried sDom="HpfrltFi" but I get none of the Jquery UI div wrappers for.. so I cant even style the header manually if I wanted to.. How do I get my header and footer wraps back - and how are the contants you mentioned used?
Many thanks
|
|
|
|
|
Re:JDataTable - sDom option - how to? 14 Years, 7 Months ago
|
Karma: 760
|
Download the component in 'Member Area' on our site and re-install it, please, and try the following code:
Code: |
{arijdatatable sDom='<"H"frl>t<"F"ip>'}
....
|
Regards,
ARI Soft
|
|
|
|
|
|