JavaScript + Jquery DataTable - pass data to defaultContent json column

Question

I have a dynamic jQuery data table. For the final column, I have the option of deleting rows. In order for this to execute, I need to pass the itemId value to the function specified within the button onClick attribute.

This is how I have currently done it but no luck:

defaultContent: "<button class='btn btn-danger' onclick='StockSearchManagment.DeleteStock(" + data.itemId + ")'>Delete</button>"

This is my full JavaScript function:

 GetInfo: function (tble) {
$(document).ready(function () {
    $.ajax({
        url: '/Home/GetList',
        dataType: "json",
        method: 'post',
        success: function (data) {
            tble.DataTable().destroy();
            tble.DataTable({
                data: data.html
                ,
                "columns": [
                    { data: "itemId" },
                    { data: "name" },
                    { data: "description" },
                    {
                        data: null,
                        defaultContent: "<button class='btn btn-danger' onclick='StockSearchManagment.DeleteStock(" + data.ItemId + ")'>Delete</button>"
                    }
                ]
            });
        },
        error: function (err) {
            alert(err);
        }
    });
});

}

John Sohn · Accepted Answer · 2020-10-01 12:26:26Z

1

you can tag the button you generate with a "data" tag and read that from the onlick event.

the tag would look like:

the onlick event would do this: var itemid = $(this).attr('data-id').val();

and then you'd have the value to use.

answered Oct 1, 2020 at 12:26

John Sohn

3201 gold badge3 silver badges9 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

MaxiGui Over a year ago

He can also get data like: $(this).data('id')

kieron · Accepted Answer · 2020-10-01 12:54:27Z

0

I refered to this stack overflow question: Passing more than one value into a button in the server side Datatable Jquery using MVC

It's now working with render instead of defaultContext:

"render": function (data, type, full) {

 return '<button class="btn btn-danger" onclick="StockSearchManagment.DeleteStock(' + full.itemId + ')">Delete</button>';

}

answered Oct 1, 2020 at 12:54

kieron

3425 silver badges23 bronze badges

Collectives™ on Stack Overflow

JavaScript + Jquery DataTable - pass data to defaultContent json column

2 Answers 2

1 Comment

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related