Mark Evans Mark Evans - 1 month ago 22
jQuery Question

How to add dropdown colum to table in datatables JQuery plugin

I am able to add the colum but im unable to return the correct values for the cell. I need a way to get the selected item for each row when button is clicked. How do I go about this? I am only able to return the first row value but not the second or third. For example if I change

$selected_value = $('td:eq(6) option:selected',row[2]).text();

this will return the first row value.

$(document).ready(function () {
var table = $('#example').DataTable();

$('#example tbody').on('click', 'tr', function () {

$('#button').click(function () {
var ids = $.map(table.rows('.selected').data(), function (item) {
return item[0]
for (var i = 0; i < table.rows('.selected').data().length; i++) {

alert(table.rows('.selected').data()[i] + ' row(s) selected');
var ids = table.rows('.selected').data()

$('#button').click(function (row, data, index) {
row = table.rows('.selected');
data = table.rows('.selected').data();

$selected_value = $('td:eq(6) option:selected',row[2]).text();
alert($("input:text", row[1]).val());
alert($('td:eq(9)', row[1]).text());
alert($('td:eq(10)', row[1]).text());


as show in this Jfiddle:


I got a little lost in your click functions and tried to simplify to a single function to alert the selected dropdown value for each selected row. I am using the jQuery each method to iterate through each .selected row.

        alert( $(this).find(":selected").text() );