Uncaught TypeError: Cannot read property 'style' of undefined,how to slove

ridwan123

I am trying to fetch data from mysql database using serverSide and processing. But it gives me "Uncaught TypeError: Cannot read property 'style' of undefined". well, I am using OOP class and object for fetch data from database. How can i solve it,I am new member and beginner of dataTable integration using serverSide Processing.

here is my code:

In a class Dashboard() , I call a public function fetch()->

  ```  public function fetch()
    {
        $query = '';
       // $outPut = array();
        if($_POST["action"] == "dataLoad"){
        if (isset($_POST['search']['value']) && isset($_POST['order']) && (isset($_POST['length']) != -1)) {
            $query = " SELECT * FROM summary WHERE is_trashed = 'NO'  AND
            (`name` LIKE '%" . $_POST['search']['value'] . "%'  OR
             `title` LIKE '%" .$_POST['search']['value']. "%'  OR
              `vision` LIKE '%" .$_POST['search']['value']. "%'  OR
               `expertise` LIKE '%" .$_POST['search']['value']. "%'  OR
               `experience` LIKE '%" .$_POST['search']['value']. "%'  OR
               `cposition` LIKE '%" .$_POST['search']['value']. "%'  OR
               `fiverr` LIKE '%" .$_POST['search']['value']. "%'  OR
               `upwork` LIKE '%".$_POST['search']['value']. "%'  OR
               `linkedin` LIKE '%".$_POST['search']['value']. "%' OR
               `profile` LIKE '%".$_POST['search']['value']."%'
              ) ORDER BY '".$_POST["order"][0]["column"] . "' '" .$_POST["order"][0]["dir"] . "'
               LIMIT '". $_POST["start"] ."', '". $_POST["length"] . "'";
            $STH = $this->DBH->query($query);
            $STH->setFetchMode(PDO::FETCH_OBJ);
            $searchData = $STH->fetchAll();                       
          $filteredRow = $STH->get_all_data($query);
        $dataArray = array();                      
               foreach ($searchData as $oneData) {
                   $img = '';
                   $profile = $oneData->profile;

                   if (isset($profile) ) {
                       $img = '<img src="images/' . $profile . '" class="img-thumbnail" width="50" height="35" alt="img">';
                   } else {
                       $img = '';
                   }
                   $subArray[] = array();
                   $subArray[] = $oneData->id;
                   $subArray[] = $oneData->name;
                   $subArray[] = $oneData->title;
                   $subArray[] = $oneData->vision;
                   $subArray[] = $oneData->expertise;
                   $subArray[] = $oneData->expertise;
                   $subArray[] = $oneData->experience;
                   $subArray[] = $oneData->cposition;
                   $subArray[] = $oneData->fiverr;
                   $subArray[] = $oneData->upwork;
                   $subArray[] = $oneData->linkedin;
                   $subArray[] = $img;
                   $subArray[] = '<div class="btn-group btn-group-sm">
                  <a href="../Dashboard/edit.php?id= ' . $oneData->id . '" id="' . $oneData->id . '" class="btn 
                      btn-outline-dark btn-sm"><i class="fas fa-pen"></i></a>                                                
                                            </div>';
                   $dataArray[] = $subArray;
               }                              
              $allData = $this->index();
              $totalRows = $this->get_all_data($allData);
        $outPut = array(
            "draw"    => intval($_POST["draw"]),
            "recordsTotal"  =>  $filteredRow ,
            "recordsFiltered" => $totalRows, 
            "aadata"    => $dataArray
        );            
           echo json_encode($outPut);
         }else {

            $query .= " ORDER BY id DESC";
          }
                   }
                   }```

this is my ajax code for datatable:

   ```      $(document).ready(function(){
     var dataAction = "dataLoad";
     $('#example').DataTable({  
     bProcessing: true,
    serverSide:true,
responsive:true,
     pageLength: 7,
    ordering:true,
   // serverMethod : "POST",
    //dataType: "json",
    lengthMenu : [ [10, 25, 50, 100], [10, 25, 50,100] ],  
     ajax: {
    url: "fetch.php",
    method: "POST",
    data: [{action: dataAction}] 
      },

    columnDefs:[
     {
      targets: [0,10,11,12],
      orderable:false
     }
       ]
      });
     });```

And finally my fetch.php code is like that

   ```<?php
         require_once __DIR__ ."/../../vendor/autoload.php";

            $objDashBoard= new PortFolioApp\Dashboard\DashBoard();
        //$allData = $objDashBoard->index();
          //$allData =   $objDashBoard->index();
        if (isset($_POST['search']['value']) && isset($_POST['order']) && (isset($_POST['length']) != -1)) {
        $someData =    $objDashBoard->fetch();
       // return $someData;
       echo json_encode($someData);
            }```

I will be very glad if someone help me to find out what is wrong with my code, thanks in advence

kthorngren

There are a lot of posts on the forum with that error. If I remember correctly they are usually due to the HTML table columns not matching the number of columns defined in Datatables. Or you could have rowspan or colsan in the table which isn't supported. Or you don't have 13 columns which you have in this option, the 12:

    columnDefs:[
     {
      targets: [0,10,11,12],
      orderable:false
     }

Without being able to see your page or a test case replicating the problem it will be hard to say exactly what the issue is.
https://datatables.net/manual/tech-notes/10#How-to-provide-a-test-case

Kevin