Within a table row of a dynamically generated table, I have multiple buttons each with its own functionality. My goal is to figure out how to pass the specific button ID to the onclick event of that table row when one of these buttons is clicked.
$('#demotbl').DataTable( {
"aaData": data,
"aoColumns": [
{ "sTitle": "PrescriptionId" },
{ "sTitle": "PatientNumber" },
{ "sTitle": "PatientName" },
{ "sTitle": "Address" },
{ "sTitle": "PhoneNumber" },
{ "sTitle": "Prescription" },
{ "sTitle": "Date" },
{
"targets": -1,
"data": null,
"defaultContent": "<input type='submit' id ='btn2' name='btn2' value='view' />"
},
{
"targets": -2,
"data": null,
"defaultContent": "<input type='file' class='cloudinary-fileupload' data-cloudinary-field= 'image_id' />"
},
{
"targets": -3,
"data": null,
"defaultContent": "<input type='submit' id='btn' name='btn' value="btn" />"
}
]
})
var table = $('#demotbl').DataTable();
$('#demotbl tbody').on( 'click', 'button', function (e) {
e.preventDefault();
console.log('selected')
var tr = $(this).closest('tr');
var rows = table.row(tr);
var info = rows.data();
var dat = [info];
var patient_info = info[1];
console.log( "patientinfo",info);
// demoFromHTML(dat)
} );
How can I effectively pass button IDs within the above code snippet, especially when dealing with the onclick event in jQuery?