fnResizeButton only affect first button

Fredon78

Hello,

I am using datatables with hidden of visible div.
When I make a div visible I use the command fnResizeButton to make the click on the buttons CSV and Excel working. But actually it worked only on the first button.
Any clues of the origin of the problem would be welcome.

Morever, If there is only one button it works, and if there are two buttons only the first button is really clickable.

If I am able to fix it I will find Datatables really perfect :-)


Here ise the code for my table :
[code]
$(document).ready(function() {
var patt = new RegExp("<[^>]*>","gi");
$(\'#tableIndels\').dataTable( {
"bAutoWidth": false,
"bProcessing": true,

"bServerSide": true,
"iDisplayLength": 200,
"oLanguage": {
"sLengthMenu": \'Display 50100200300400 records\'
},
"aoColumns": [
/* Symbol */ {"sClass": "center", "bSearchable": true, "bVisible": true, "bSortable" : true},
/* Chromosome */ {"sClass": "center", "bSearchable": true, "bVisible": true, "bSortable" : false},
/* Start - End */ {"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* Mrna */ {"sClass": "center", "bSearchable": true, "bVisible": true, "bSortable" : false},
/* Type */ {"sClass": "center", "bSearchable": true, "bVisible": true, "bSortable" : false},
/* Base */ {"sClass": "center", "bSearchable": true, "bVisible": true, "bSortable" : false},
/* Function */{"sClass": "center", "bSearchable": true, "bVisible": true, "bSortable" : false},
/* Number of reads */ {"sClass": "center", "bSearchable": false, "bVisible": true, "bSortable" : false},
/* id */ {"sClass": "center", "bSearchable": false, "bVisible": true, "bSortable" : false},
/* Cosmic */{"sClass": "center", "bSearchable": false, "bVisible": true, "bSortable" : false},

/* disease_code*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* sample_id2*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* sample_id1*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* strand*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* phase*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* status*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* indel_type*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* mutation_type*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* gene_id*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* mrna_to_chr*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* adj_exonnum*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* exonnum*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* target*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* mapping_q_c*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* mapping_q_r*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* sample_pair*/{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false},
/* freq_sp */{"sClass": "center", "bSearchable": false, "bVisible": false, "bSortable" : false}


],
"sDom": \'T<"clear">Cilprt\',
"oTableTools": {
"sSwfPath": "./TableTools/media/swf/copy_csv_xls_pdf.swf",
"aButtons": [
{
"sExtends": "csv",
"sButtonText": "CSV",
"mColumns": "visible"
},
{
"sExtends": "xls",
"sButtonText": "Excel",
"mColumns": "visible"
}
]
},
"oColVis": {
"fnLabel": function ( index, title, th ) {
return title.replace(patt,"");
}
},
"sAjaxSource": "./ajaxIndels.php?patientid=' . $pk_patient . '"
}).columnFilter(
{
sPlaceHolder: "head:after",
aoColumns: [ {type: "text"},
{type: "text"},
null,
{type: "text"},
{type: "select", values: ["' . implode('","', DboTable::getDistinctColumnFromTable("indel_type_text" , Consts::$indelsTable)) . '"] }
,null,
{type: "select", values: ["' . implode('","', DboTable::getDistinctColumnFromTable("function" , Consts::$indelsTable)) . '"] },
null,
null,
null,
null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null, null
]
, bUseColVis: true
}
);



});
[/code]


And here is the code to make the buttons clickable :

[code]
$("ul.tabNavigationTwo li a:contains('INDELS')").click(function(){
TableTools.fnGetInstance('tableIndels').fnResizeButtons();
});
[/code]




Thanks in advance,

Fred

Fredon78

Just to add information I put some alert message in the function fnResizeButtons like below

[code]
/**
* Resize the flash elements of the buttons attached to this TableTools instance - this is
* useful for when initialising TableTools when it is hidden (display:none) since sizes can't
* be calculated at that time.
*/
"fnResizeButtons": function ()
{
for ( var cli in ZeroClipboard_TableTools.clients )
{
if ( cli )
{
alert(cli);
var client = ZeroClipboard_TableTools.clients[cli];
if ( typeof client.domElement != 'undefined' &&
client.domElement.parentNode )
{
alert('in');
client.positionElement();
}
}
}
},
[/code]
and it seems to work well cause I got the 4 alerts :
[quote]
1, in, 2, in
[/quote]

Fredon78

Here is my debug file :
http://debug.datatables.net/izupak

Fredon78

OK I think I found out some kind of bug Because here is the html code for the second button :

Indeed in the code below the left of the div should be 0px and not 49px in order to position the DIV just above the button and not on his right.

Allan could we say that it is a kind of bug ?

Thanks in advance for your opinion.

Fred

[code]



[/code]

Fredon78

Finally here is the code I used to fix the bug : It just set the left attribute to all te button to 0px :

[code]
$("ul.tabNavigationTwo li a:contains('INDELS'))").click(function(){
if (TableTools.fnGetInstance('tableIndels') != null && TableTools.fnGetInstance('tableIndels').fnResizeRequired()) {
TableTools.fnGetInstance('tableIndels').fnResizeButtons();
$("a.DTTT_button div").css("left","0px");
}
});
[/code]