How to use Datatables column data (done in js) in action button url’s last segment?

How to use Datatables column data (done in js) in action button url’s last segment

I have a column data that gives the output of from a database table. I want to one of the columns data at the last segment of the url. My provided attachment photo shows the details. If anyone could help

data: ‘file_id’ to be used in url

    <script type="text/javascript">
    $(document).ready(function(){
        
        $('#empTable').DataTable({
            'processing': true,
            'serverSide': true,
            'serverMethod': 'post',
            'ajax': {
              'url':'<?=base_url()?>admin/Employee/empList'
            
            },
             dom: 'Bfrtip',
             buttons: [
                    {extend: 'copy', attr: {id: 'allan'}}, 'csv', 'excel', 'pdf'
                ],
            'columns': [
                { data: 'id_no' },
                { data: 'customer_name' },
                { data: 'seized_remarks' },
                { data: 'seized_date' },
                { data: 'release_probability' },
                { data: 'file_id' },
                
                { data: null,
                  defaultContent: '<a href="https://202.40.176.13/mahindra_portal/admin/seized_vehicles/individual_view/$file_id"><button ><i class="fa fa-search"></i></button></a> <input type="button" id="go" value="Upload Image" /> <button>Edit</button>' },
                


                
            ]
        });
    });

    </script>

Answer

What you can do is define a render function, e.g.:

$('#empTable').DataTable({
    'processing': true,
    'serverSide': true,
    'serverMethod': 'post',
    'ajax': {
      'url':'<?=base_url()?>admin/Employee/empList'
    
    },
     dom: 'Bfrtip',
     buttons: [
            {extend: 'copy', attr: {id: 'allan'}}, 'csv', 'excel', 'pdf'
        ],
    'columns': [
        { data: 'id_no' },
        { data: 'customer_name' },
        { data: 'seized_remarks' },
        { data: 'seized_date' },
        { data: 'release_probability' },
        { data: 'file_id' },
        { data: null,
            render(data) {
                return `<a href="https://202.40.176.13/mahindra_portal/admin/seized_vehicles/individual_view/${data.file_id}"><button ><i class="fa fa-search"></i></button></a> <input type="button" id="go" value="Upload Image" /> <button>Edit</button>`;
            }
        },
    ]
});

This then lets you access whatever’s in the data object. See the documentation