时间戳

首页 > 解决方案 > How to use Datatables column data (done in js) in action button url's last segment?

javascript - 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>

enter image description here

标签： javascriptphpajaxcodeigniterdatatables

解决方案

你可以做的是定义一个渲染函数，例如：

$('#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>`;
            }
        },
    ]
});

然后，这使您可以访问data对象中的任何内容。 请参阅文档

推荐阅读