How to add html element for row?

rusumat · February 2018

Hi;
I adding "checkbox element" to row in table, but not working. It seem text "[object Object]".

var collectiveFeesReceiptList=[];
table.DataTables() content;

data: collectiveFeesReceiptList,
            columns: [
                { data: 'Column1' },
                { data: 'Column2' },
                { data: 'Column3' },
                { data: 'Column4' },
                { data: 'RemoveCheckBox' }
            ]

My codes;

function GeneratedItemsTable() {
            if (collectiveFeesReceiptList.length > 0) {
                $datatable.clear().draw();
                $.each(collectiveFeesReceiptList, function (i, val) {
                    var flatid = collectiveFeesReceiptList[i].FlatId;
                    var $removecheckbox = $('<input id="RemoveCheckBox' + flatid + '" type="checkbox" data-noapply="true">');
                    $removecheckbox[0].checked = true;
                    $removecheckbox.change(function () {
                        var check = $(this)[0].checked;
                        if (check == true) {
                            ...
                        }
                        else {
                            ...
                        }
                    });
                    collectiveFeesReceiptList[i].RemoveCheckBox = $removecheckbox;
                });
                $datatable.rows.add(collectiveFeesReceiptList).draw();
            }
            else {
                $datatable.clear().draw();
            }
        }

I want to see this;

How to fix this?
Thanks.

colin · February 2018

Hi Rusumat,

Take a look at this live example - this shows a checkbox being added to the end of all the rows.

Hope that helps,

Cheers,

Colin

rusumat · February 2018

Thank you very very much. I solved my problem with your opinion, thank you again
Codes for those interested;

table.DataTables() content;

data: collectiveFeesReceiptList,
            columnDefs: [{
                "targets": -1,
                "render": function (data, type, row) {
                    var checkbox = '<input type="checkbox"id="RemoveCheckBox' + data.FlatId + '" data-noapply="true" checked="checked">';
                    return checkbox;
                }
            }],
            columns: [
                { data: 'Column1' },
                { data: 'Column2' },
                { data: 'Column3' },
                { data: 'Column4' },
                { data: null }
            ]

function content;

function GeneratedItemsTable() {
            if (collectiveFeesReceiptList.length > 0) {
                $datatable.clear().draw();
                $datatable.rows.add(collectiveFeesReceiptList).draw();
            }
            else {
                $datatable.clear().draw();
            }
        }

colin · February 2018

Excellent, glad to hear it's all up and running!!

C

How to add html element for row?

How to add html element for row?

Answers

Howdy, Stranger!

Categories

DataTables

How to add html element for row?

How to add html element for row?

Answers

Howdy, Stranger!

Quick Links

Categories

DataTables