How to put a html element in a specific cell in datatable?

derekrm

So i was hoping to do something like this

** table.cell(rowIdx, 2).data(< div > ${ element }</div >); ---> here lies the problem i was hoping to overide the existing cell with a html element**

                      table
                        .rows({ selected: true })
                        .every(function (rowIdx, tableLoop, rowLoop) {

                            var dataBE = table.row(rowIdx).data();
                            var inventoryonhand = dataBE[9];
                            var finoh = inventoryonhand == "" ? 0 : inventoryonhand;
                            var yetb = parseInt(tohiblk) - parseInt(finoh);
                            var yetbfinal = "";


                        if (Number.isNaN(yetb) || yetb == 0) {
                            yetbfinal = ""
                        } else {
                            yetbfinal = yetb;
                        }


                            table.cell(rowIdx, 11).data(yetbfinal);
                            table.cell(rowIdx, 10).data($('#tohiBE').val());
                            table.cell(rowIdx, 16).data($('#insBE').val());

                            table.cell(rowIdx, 2).data(`< div > ${ element }</div >`); ---> here lies the problem i was hoping to overide the existing cell with a html element

                        }).draw();

AndreOosthuizen

If you say html element, do you mean button, input, p etc?

derekrm

I was hoping to know how to implement this code

since blkbuyername contains ["Person1", "Person2"]
blkbuyername.forEach(element => target.find('td:eq(12)').append(<div>${element}</div>))

into

table.cell(rowIdx, 2).data(<each here>);

So my expected result should be

<td>
<div>Person1</div>
<div>Person2</div>
</td>

from what i could come up

table.cell(rowIdx,2).data(a.forEach(element => (just dont know what to put here as i can't say find specific column)))

AndreOosthuizen

I think this might point you in the right direction - https://codeproject.com/Questions/1198280/Add-dynamically-textfield-and-button-in-datatable

Just append it for div etc.

derekrm

Well finally got what I wanted
wherein blkbuyername is an array.

```var arrbname = [];
blkbuyername.forEach(element => arrbname.push(<div>${element}</div>));
table.cell(rowIdx, 12).data(arrbname.toString().replace(",", ""));