target first cell of this row with custom button

MickMan

Hi everyone.

I have added a custom button on the last column of the table (feeded with ajax data) that calls a function to fetch an url.

The function needs a var:
var = data from the first cell of the same column of the clicked button
but i don't know how to target it.

I read the cell().data() api page, but i'm not good enough to make it working.

I thought this would be an easy task... ^_^'

Thanks in advance for any help.

colin

You can use columns.render to modify how the cells will be created, or one of the callback functions, such as createdRow. There are examples in both those reference pages that should get you heading in the right direction,

Colin

MickMan

Thanks Colin, but i don't understand how that could be useful.
Sirry, i'm not very good in js, as you can imagine...

I thought that something like these 2 examples would be what i need, but instead of this (cell) i need first cell of the corresponding row of the clicked button.

i thought it was just a sintax problem.

https://datatables.net/reference/api/cell().data()

var table = $('#example').DataTable();

$('#example tbody').on( 'click', 'td', function () {
alert( table.cell( this ).data() );
} );

https://datatables.net/reference/api/cell().render()

var table = $('#example').DataTable();

$('#example').on( 'click', 'tbody td', function () {
var data = table.cell( this ).render( 'display' );

console.log( data );

} );

colin

it wasn't cell().render() I was referring to, it was columns.render. That can be used to change the appearance of the cells, as shown in this example where flags and progress bars are puts into the cells. You could use the same approach to add those links,

Colin

MickMan

I'm so bad that i can't really understand.
I don't need to render the cell i clicked, but i need to retrieve data from another cell on the same row.

I'm really sorry for my ignorance and sadly i can't upvote your post.

I leave picture and code i used.

Pressing the button in the last cell of the first row, must feed a variable with the data in the first cell (of the same row), so i can use that variable to fetch an url.

The code i used:

The function:

function cancellaisin(){
var rimuoviISIN = ??? THE FIRST CELL OF THE CLICKED BUTTON ROW ??? **
var response = fetch(https://mysite.com/?user=<?php echo $slusername_html; ?>**&isin=+rimuoviISIN+&action=1);
console.log(response.status); // 200
console.log(response.statusText); // OK
}

The button in the last column:

{ "data": null, className: "text-right",
render: function(data, type, full){return '<INPUT type="button" class="button tiny" value="Rimuovi" onClick="cancellaisin();">';}
}

Again: thank you so much for your time and please forgive my ignorance.

colin

OK, could you create a test case with what you've got, please - that'll ensure we're talking in the same same direction. Information on how to create a test case (if you aren't able to link to the page you are working on) is available here.

Cheers,

Colin

MickMan

I solved my problem giving the same first cell value to the button cell, instead of null

{ "data": "ISIN", className: "btnrimuovi",
render: function(data, type, full){return '<INPUT type="button" class="button tiny" value="Rimuovi">';}
}

then i used this

$('#mytable').on( 'click', '.btnrimuovi', function ()

This method gives me the same result, with far less troubles.

Thank you so much again for your help, Colin!