Button in table calling a method?

nm_alex

Hi!

How can I bind the click event of a button, that is added dynamically by fnRender, to a mathod?
I want to show a button in each row, so that the user can push it and issue some action for the given row.
Any hint is aprecciated :)

Best regards, Alex

izzy6150

Hi nm_alex,

Can you post some example code so we can see what you are trying to do a little better.

I am guessing (without any code present) that what you require to do is something along the lines of the following
[code]
$(document).ready(function() {
$('#example').dataTable( {
"aoColumns": [
{ "fnRender": function ( oObj ) {
return oObj.aData[0] + ' ';
} },
null,
null
]
} );

function doSomethingSpecial( btn_id )
{
// your special request using the id for reference goes here.
}
} );
[/code]

but without knowing how you dynamically add the buttons i can not be certain.

Regards,
Izzy

nm_alex

Hi!

Here is my code, it's pretty much what you considered I was talking about :)

[code]
$('#filters').dataTable( {
"aoColumns": [
{ "fnRender": function ( oObj ) {
var inline_button = '';
return inline_button;
} },
{ "fnRender": function ( oObj ) {
var export_id = oObj.aData[0];
return '' + oObj.aData[1] + '';
} },
null,
null,
null
],
"bProcessing": true,
"bServerSide": true,
"sAjaxSource": "bin/table.php"
} );
[/code]

Atm, there is an input (type=button), that does nothing. I could use the onclick-handler, but isn#t that what we have things like jQuery for? I'm using it anyways, so I was wodering if there is another method to bind the execution of a method to the button. Something like that what you can do in the document.ready-part:
[code]

$(document).ready(function() {
$('#your_btn').click(your_method_name);
});

[/code]

Thx & regards, Alex

izzy6150

Hi Alex,

You should be able to use something like the following
[code]
// add a class and id to the buttons
var inline_button = '';

$(".clickableButton").bind("click", function(e){
var btnId = $(this).attr("id");
// do something possibly using the $(this).attr("id");
// $("span").text("Click happened! ( " + e.pageX + ", " + e.pageY + " )"); // example to get the click location from the event
});
[/code]

Hope this helps.

Regards
Izzy

allan

Hi guys,

The demo showing how to add events post initialisation might be of some interest here as well: http://datatables.net/examples/advanced_init/events_post_init.html .

Regards,
Allan