select single row and display in formatted popup

Sloan

First, thank you Allan and other contributors for creating an excellent and much-needed tool.

This is a client-side and novice JS question. I'm trying to click on a row and have the data displayed in a formatted popup that works much like how the TableTools Copy and Print Buttons function (JS div). I was under the impression that the best way to do this is to try the following:

[code]
$(document).ready(function() {

var oTable = $('#example').dataTable( {
"sScrollY": 400,
"sScrollX": 800,
"bJQueryUI": true,
"sDom": '<"H"Tfr>t<"F"ip>',
"sPaginationType": "full_numbers",
"iDisplayLength": 100,
"oLanguage": {
"sSearch": "Search all columns:"
},
"oTableTools": {
"sRowSelect": "single",
"bSortCellsTop": true,
"aButtons": [ "copy", "csv", "xls", "print"]
}
} );

/* Add a click handler to the rows - this could be used as a callback */
$("#example tbody").click(function(event) {
var oTT = TableTools.fnGetInstance( 'example' );
var Record = oTT.fnGetSelectedData();

alert(Record);

oTT.fnSelectNone();
});
[/code]

I get an alert message that displays the entire row, but I don't know what to replace the "alert(Record)" with to get the desired result (attempts at using variations of the fnInfo code here failed). The formatting aspect is not a problem since I basically need to get the popup (showing raw data) to work, but how does one employ something like the fnInfo method (var nInfo = document.createElement( "div" ); ........ document.body.appendChild( nInfo );) here? Or, is there a better/easier way? Thank you for any help.

Sloan

girishmr

Do you want this to be displayed in a form in a modal window? Is that your aim?