Be part of JetBrains PHPverse 2026 on June 9 – a free online event bringing PHP devs worldwide together.

bipin's avatar
Level 2

how to append data to datatable

hello guys don't know what i m miss please help table data is not append with table header here is my code

                  <div class="tile-body">

                           
                                    <div class="table-responsive">
                                        <table id="invoice">
                                            <thead>
                                          
                                                <th style="width:80px;">HR Id</th>
                                                <th style="width:120px;">Job_Id</th>
                                                <th style="width:180px;">Applicant_Id</th>
                                                <th style="width:80px;">Status</th>
                                                <th style="width:90px;">created</th>
                                                <th style="width:150px;">Actions</th>
                                            </tr>
                                            </thead>
                                        </table>
                                    </div>

                                </div>

my script is

                            var data={ _token: "{{csrf_token()}}"};
               $.ajax({
                        type:"POST",
                       dataType: 'json', 
                      url:'{{ url('invoices') }}',
                      data:data,  
                   success: function (data) {
      
                  $('#invoice').dataTable({
      
                      data: data,
                      columns: [
                                       { "data": "HR_Id"  },
                                       { "data": "Job_Id" },
                                       { "data": "Applicant_Id" },
                                       { "data": "Status" },
                                       { "data": "created" },
                                       { "data": "Action" }
                                         ],
                     });
 
            } 

why success column data is not automatically creating td in my table here is my json data

        {"data":[{"HR_Id":"[email protected]","Job_Id":"J1000","Applicant_Id":"A1001","Status":"pending","created":null,"Action":"&emsp;<a href='http:\/\/localhost\/mwayhire_de\/public\/generated\/invoices?' title='Generate' ><span class='glyphicon glyphicon-list'><\/span><\/a>"}
0 likes
2 replies
mtmfahath's avatar
<script type="text/javascript">
    var ajaxURL = base_url+"/customers"
    var SSPEnable = true
    var opt = {
            processing: true,
            serverSide: true,
            ajax:{
                    url:'{{ url('customers-all') }}',
                    type:'POST',
                    headers: {'X-CSRF-TOKEN': token},
                    dataType: 'JSON',
                    beforeSend: function (xhr) {
                    xhr.setRequestHeader('Authorization');
                    }
                },
            columns:[
              {data: 'id' , name: 'id',"visible": false,orderable: true},
              {data: 'name' , name: 'name'},
              {data: 'contact_person' , name: 'contact_person'},
              {data: 'contact_person_number' , name: 'contact_person_number'},
              {data: 'address' , name: 'address'},
              {data: 'location_id' , name: 'location_id'},
              {data: 'commission_type' , name: 'commission_type'},
              {data: 'commission_value' , name: 'commission_value'},
              {data: "action",orderable: false, searchable: false},
            ],
    }
  </script>

i don't know what is the issue.. have a look with my code

bipin's avatar
Level 2

@mtmfahath if i use above code search of datatable not working so i use another way which i has question here still no luck

Please or to participate in this conversation.