Home > database >  How can I add <a> tag in the column of datatable?
How can I add <a> tag in the column of datatable?

Time:03-24

I am making a table of product with their respective subgroup with datatable. I am trying to make the "group" to be like a link. When user click it, it will redirect to a page of the product group and all the product under the group.

this is my code.

var prod_table = $('#product_table').DataTable({
   "bProcessing": true,
   "serverSide": true,
   "pagingType": "first_last_numbers",
   responsive: true,
   stateSave: true,
   "lengthMenu": [
   [10, 25, 50, 100],
   [10, 25, 50, 100]
   ],
   language: {
       search: "_INPUT_",
       searchPlaceholder: "Search product here..",
   },
   "order": [
   [0, "desc"]
   ],
   "ajax": {
       url: "php/get_product.php",
       type: "post"
   }
});

<table  id="product_table" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th><b>Product Code</b></th>
            <th><b>Product Name</b></th>
            <th><b>Manufacturer</b></th>
            <th><b>Group</b></th>
            <th><b>Price</b></th>
        </tr>
    </thead>
    <tbody>
    </tbody>
</table>

My current table | Product Code | Product Name | Manufacturer | Group | Price | | -------- | -------------- | -------- | -------------- | -------- | | ABC123 | teser 1 | test inc | Hardware | $45.00 | | DEF456 | tester 2 | test2 pte ltd | Software | $120.00 |


Expected outcome | Product Code | Product Name | Manufacturer | Group | Price | | -------- | -------------- | -------- | -------------- | -------- | | ABC123 | teser 1 | test inc | <a href="viewgroup.php?group='hardware'">Hardware</a> | $45.00 | | DEF456 | tester 2 | test2 pte ltd | <a href="viewgroup.php?group='software'">Software</a> | $120.00 |



Thanks!!
Jeff

CodePudding user response:

Try adding a <span> <a href> </a> </span> to your <td> element.

<td> <span><a href="viewgroup.php?group=hardware">Hardware</a></span></td>

CodePudding user response:

Try following code.

<td>
<a href="www.mywebsite.com/about.html">About</a>
</td>
  • Related