JQuery Data table can not get value from row

Question

I am trying to get value from row and call a function with onClick

{
                mDataProp: null,
                "sClass": "left",
                "render": function (data, type, row, meta) {
                    console.log("row" + JSON.stringify(row));
                    let el = "";
                    let id = row["id"];
                    let value = row["value"];

                    if(id !== "" && value !== "") {
                        el = "<a title='Delete' onclick='del(" + id + ", " + value + ")'><i class='fas fa-trash'></i></a>"
                        console.log(el);
                    }
                    return el;
                }
            }

Here the console output is ok

row{"id":"abc","value":"111"}
<a title='Delete' onclick='del(abc, 111)'><i class='fas fa-trash'></i></a>

But in the del function the value of id changes

function del(id, value) {
    console.log("delete " + id + value);
    //
}

The output is

delete [object Object]111

Why I can not pass proper value to the function. How do I solve this?

Answer 1

try to change the string quotation to backtick "``"

el = <a title='Delete' onclick='del("${id}", "${value}")'><i class='fas fa-trash'></i></a>

enter image description here