How can i render HTML in this example.

Monclee

Hi here is my code, i need to add a Link to edit each item on the table.

HTML:

    <table id="hugetable" class="display nowrap table table-hover table-striped table-bordered" cellspacing="0" width="100%">
                                            <thead>
                                                <tr>
                                                    <th width="200px">Producto</th>
                                                    <th width="200px">Sku</th>
                                                    <th>std</th>
                                                    <th>mm</th>
                                                    <th>familia</th>
                                                    <th>Precio</th>
                                                    <th>Especial</th>
                                                    <th>Stock</th>
                                                    <th>Cat</th>
                                                    <th></th>
                                                </tr>
                                            </thead>
                                            <tfoot>
                                                <tr>
                                                    <th>Producto</th>
                                                    <th>Sku</th>
                                                    <th>std</th>
                                                    <th>mm</th>
                                                    <th>familia</th>
                                                    <th>Precio</th>
                                                    <th>Especial</th>
                                                    <th>Stock</th>
                                                    <th>Cat</th>
                                                    <th></th>
                                                </tr>
                                            </tfoot>
                                            <tbody>


                                            </tbody>
                                        </table>

JS:

$('#hugetable').DataTable({
        dom: 'Bfrtip',
        ajax: 'http://localhost/admin/index.php?page=product/data_load/',
        deferRender:    true,
        pageLength: 10,
        responsive: true,
        buttons: [
             'csv', 'excel'
        ],
        columnDefs: [ {
            targets: 9,
            data: "download_link",
            render: function ( dataField ) {
            return '<a href="'+dataField+'">Download</a>';
            }
        } ]

    });

AND PHP :

$res=$db->execute_query("select * from ".TABLE_PREFIX."products ".$qrstr." ");
        $products = array();

        while($row=$res->fetch_assoc())
        {   

            $nestedData = array();
            $nestedData[] = $row["nombre"];
            $nestedData[] = $row["sku"];
            $nestedData[] = $row["std"];
            $nestedData[] = $row["mm"];
            $nestedData[] = $row["familia"];
            $nestedData[] = $row["precio"];
            $nestedData[] = $row["precio_especial"];
            $nestedData[] = $row["stock"];
            $nestedData[] = $row["cat"];
            $nestedData[] = $row["id"];
            $products['data'][] = $nestedData;
        }


        echo json_encode($products, JSON_PRETTY_PRINT);

The result is a link with http://localhost/undefined

What am i doing wrong?

Monclee

For anyone facing this. The error was data: "download_link" ,

Here is the final and working Js

$('#hugetable').DataTable({
        dom: 'Bfrtip',
        ajax: 'http://localhost/admin/index.php?page=product/data_load/',
        deferRender:    true,
        pageLength: 10,
        responsive: true,
        buttons: [
             'csv', 'excel'
        ],
        columnDefs: [ {
            targets: 9,
            render: function ( data ) {
            return '<a href="index.php?page=product/edit/'+data+'">Download</a>';
            }
        } ]

    });