Add attributes like "data-" to TDs -- How-to
Add attributes like "data-" to TDs -- How-to
kktos
Posts: 11Questions: 0Answers: 0
I needed to have attributes added to the TD in my dataTable.
As I thought to use RowCallback would be to late to add those attributes and also because all is in the aoColumns, I mean the descriptions of the cells, I thought of of solution:
- added a field "aAttrs" in the column description which is the attributes I wish to add
- to change _fnCreateTr to take into account those news attributes.
So, to add an attribute like data-type="text", I simply put in my column descriptor a aAttrs:{ 'data-type': 'text' }
and I modified the function _fnCreateTr around line 1122 like:
[code]
nTd = document.createElement( oCol.sCellType );
/* ADD ATTRIBUTES IF ASKED */
if ( oCol.aAttrs && typeof oCol.aAttrs == 'object' ) {
for ( var at in oCol.aAttrs )
{
nTd.setAttribute(at,oCol.aAttrs[at]);
}
}
/* Render if needed - if bUseRendered is true then we already have the rendered
* value in the data source - so can just use that
*/
nTd.innerHTML = (typeof oCol.fnRender === 'function' && (!oCol.bUseRendered || oCol.mData === null)) ?
_fnRender( oSettings, iRow, i ) :
_fnGetCellData( oSettings, iRow, i, 'display' );
[/code]
What do you think of this ?
Let's say I would be extremely pleased if this could be validated in the next version ;)
Thanks for your attention.
/thierry
As I thought to use RowCallback would be to late to add those attributes and also because all is in the aoColumns, I mean the descriptions of the cells, I thought of of solution:
- added a field "aAttrs" in the column description which is the attributes I wish to add
- to change _fnCreateTr to take into account those news attributes.
So, to add an attribute like data-type="text", I simply put in my column descriptor a aAttrs:{ 'data-type': 'text' }
and I modified the function _fnCreateTr around line 1122 like:
[code]
nTd = document.createElement( oCol.sCellType );
/* ADD ATTRIBUTES IF ASKED */
if ( oCol.aAttrs && typeof oCol.aAttrs == 'object' ) {
for ( var at in oCol.aAttrs )
{
nTd.setAttribute(at,oCol.aAttrs[at]);
}
}
/* Render if needed - if bUseRendered is true then we already have the rendered
* value in the data source - so can just use that
*/
nTd.innerHTML = (typeof oCol.fnRender === 'function' && (!oCol.bUseRendered || oCol.mData === null)) ?
_fnRender( oSettings, iRow, i ) :
_fnGetCellData( oSettings, iRow, i, 'display' );
[/code]
What do you think of this ?
Let's say I would be extremely pleased if this could be validated in the next version ;)
Thanks for your attention.
/thierry
This discussion has been closed.
Replies
I didn't force the attributes to be "data-" like to remain open.
But that is not necessarily a good idea.
So maybe the attribute have to be set like:
[code]nTd.setAttribute('data-'+at,oCol.aAttrs[at]);[/code]
Forcing them to be all "data-" like
Allan