jQuery.dialog - dataTable - Callback not firing [solved]

dueggi

Hello. I use a datatable 1.8.2.

When I create a runtime jquery.dialog and I append an datatable (created at runtime) the header callback end footer callback not firing.
If I specify a custom callback function, it's work correctly.
Please help me.
dueggi.
[code]
var $dialog = jQuery('').html('').dialog({
autoOpen: false,
resizable: false,
height: 500,
width: 1024,
modal: true,
title: "Search",
open: function (event, ui) {
var param = "";
if (jQuery('#_datatable').length > 0)
jQuery('#_datatable').dataTable().fnDraw(false);
else {
$oTable = jQuery('').dataTable(
{
"bServerSide": true,
"bSort": false,
"bJQueryUI": true,
"sDom": '<"H"l>t<"F"ip>',
"bPaginate": true,
"sAjaxSource": 'json/json.ashx',
"fnServerData": function (sSource, aoData, fnCallback) {
jQuery.ajax(
{
"dataType": 'json',
"type": "POST",
"url": sSource,
"data": aoData,
"success": function (json) {
fnCallback(json);

jQuery('#_datatable tbody td').click(function (e) {
var nTds = jQuery(e.target.parentNode);
var codice = jQuery(nTds[0].cells[0]).text();
var valore = jQuery(nTds[0].cells[1]).text();
var messaggio = 'your selection:
' + codice + " - " + valore + "";
var DialogOpt = {
resizable: false,
height: 170,
modal: true,
title: "Confirm"
open: function (event, ui) {
jQuery(this).html(messaggio);
},
buttons: {
"OK": function () {
jQuery("#dialogConfirm").dialog('close');
jQuery($dialog).dialog("close");
},
Cancel: function () {
jQuery("#dialogConfirm").dialog('close');
} //end cancell
}//end button
};
if (jQuery("#dialogConfirm").length > 0)
jQuery("#dialogConfirm").dialog(DialogOpt);
else
jQuery('').dialog(DialogOpt);
}); // end live
} //end else
return true;
} //end
}); //end jquery.ajax
},
"aoColumns": [
{ sWidth: "50px", "sTitle": "Codice", "aTargets": [0] },
{ sWidth: "600px", "sTitle": "Descrizione", "aTargets": [1], "asSorting": ["asc"] },
{ sWidth: "250px", "sTitle": "Comune", "aTargets": [2] },
{ sWidth: "50px", "sTitle": "Cancellato", "aTargets": [3], "fnRender": function (obj) { return obj.aData[3] == "False" ? "No" : "Sì" } }
] }); //end datatable)
jQuery($dialog).html($oTable); //end append
}
} //end open
}); //dialog
[/code]

dueggi

When I create a runtime jquery dialog, i specify the code that will be contained within the same dialog:
[code]
var $dialog = jQuery('').html('').dialog({option});
[/code]

then, before you trigger the "open" event of the dialog, need to specify the contents of the dialog:
[code]
jQuery($dialog).html(jQuery(''));
jQuery('#dialogEnte')).dialog('open');
[/code]

in the "dialog open function" I create the datatable:
[code]
jQuery('#_datatable').dataTable();
[/code]

GregP

I'm having a tough time following what's going on, but that's partially due to not being at home in front of my computer with time to spare. ;-)

You are assigning a click function to... the table cell? Is the table cell ever being destroyed or replaced? Certainly using .delegate() or (as of jQuery 1.7) .on() is going to be a more efficient way to bind your clicks, so I would start there. I don't think that's the real problem, though.

I don't see where the dataTable is being created. In your very last line you have a sample initialization, and say that it is created in "the dialog open function"; but I do not see this dialog open function. .dialog('open') should just be opening the dialog, no?