Link to home
Start Free TrialLog in
Avatar of Ng Jo-Yi
Ng Jo-Yi

asked on

DataTables warning: table id=data-table - Requested unknown parameter 'Practice skills' for row 0, column 5. For more information about this error, please see http://datatables.net/tn/4

DataTables warning: table id=data-table - Requested unknown parameter 'Practice skills' for row 0, column 5. For more information about this error, please see http://datatables.net/tn/4
Upload2.html
<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Import CSV File into Jquery Datatables using PHP Ajax</title>
		<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  <script src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js"></script>
  <script src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js"></script>  
  <link rel="stylesheet" href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css" />
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>
  <style>
  .box
  {
   max-width:600px;
   width:75%;
   margin: 0 auto;;
  }
  </style>
    </head>
    <body>
	<div class="container">
   <br />
    <h3 align="center">Mark distribution Sheet</h3>
   <h3 align="center">Introduction to Mobile Application</h3>
   <br />
<form action="import2.php" method="post" enctype="multipart/form-data">
<div class="col-md-3">
     <br />
     <label>Add More Data</label>
    </div> 
	<div class="col-md-4">  
            <input type="file" name="csv_file">
			</div>  
	<div class="col-md-5">
            <input type="submit" value="Upload">
			</div>  
			<div style="scrollleft"></div>
			<div style="clear:both></div>

        </form>
	<br />
   <br />
   <div class="table-responsive" >
    <table class="table table-striped table-bordered" id="data-table">
     <thead>
      <tr>
       <th width=10%>Student ID</th>
       <th width=14%> Name</th>
	   <th width=2%> Sem</th>
	   <th> Sec</th>
	   <th width=5%>Chapter_Exam</th>
	   <th width=10%> Practice skill</th>
	   <th> Assignment</th>
	   <th> Final_Exam</th>
	   <th> Total </th>
	   <th> Grade</th>
	   <th> C01</th>
	   <th> C02</th>
	   <th >C03</th>  
       <th >C04</th>  
	   <th >C05</th>   
	   <th>Status</th>
      </tr>
     </thead>
	 <tfoot>
            <tr>
	            <th>AM1701001001</th>
	            <th>AKMAL NABIL BIN MUHAMAD ISA</th>
	            <th>4</th>
	            <th>1</th>
	            <th>82</th>
	            <th>92</th>
				<th>90</th>
				<th>67</th>
				<th>80</th>
				<th>A-</th>
				<th>83</th>
				<th>83</th>
				<th>83</th>
				<th>83</th>
				<th>92</th>
				<th>Pass</th>
            </tr>
        </tfoot>
    </table>
   </div>
  </div>
  <script>
  $(document).ready(function(){
	jsonData = [{"student_id":"AM1701001002","name":"AMIR NAQIUDDIN BIN ABDULLAH","Sem":"4","Sec":"1","Chapter_Exam":"49","Practice skill":"41","Assignment":"77","Final_Exam":"29","Total":"45","Grade":"C-","C01":"49","C02":"49","C03":"49","C04":"49","C05":"41","Status":"Pass"},{"student_id":"AM1701001003","name":"JOHAN ARIFF BIN MUHD ZAKRI","Sem":"4","Sec":"1","Chapter_Exam":"66","Practice skill":"45","Assignment":"40","Final_Exam":"25","Total":"40","Grade":"D","C01":"44","C02":"44","C03":"37","C04":"44","C05":"45","Status":"Pass"},{"student_id":"AM1701001004","name":"MOHAMAD AIRIL AZLI BIN KAMAR","Sem":"4","Sec":"1","Chapter_Exam":"60","Practice skill":"48","Assignment":"55","Final_Exam":"19","Total":"40","Grade":"D","C01":"46","C02":"46","C03":"41","C04":"46","C05":"48","Status":"Pass"},{"student_id":"AM1701001005","name":"MOHAMAD AMIRUL BIN OTHMAN","Sem":"4","Sec":"1","Chapter_Exam":"62","Practice skill":"55","Assignment":"83","Final_Exam":"39","Total":"55","Grade":"C+","C01":"60","C02":"60","C03":"59","C04":"60","C05":"55","Status":"Pass"},{"student_id":"AM1701001006","name":"MOHAMAD FIRDAUS BIN MUTALIB","Sem":"4","Sec":"1","Chapter_Exam":"50","Practice skill":"48","Assignment":"75","Final_Exam":"32","Total":"47","Grade":"C-","C01":"51","C02":"51","C03":"52","C04":"51","C05":"48","Status":"Pass"},{"student_id":"AM1701001007","name":"MOHAMAD IKHWAN BIN JOHAR","Sem":"4","Sec":"1","Chapter_Exam":"76","Practice skill":"48","Assignment":"76","Final_Exam":"57","Total":"63","Grade":"B-","C01":"64","C02":"64","C03":"60","C04":"64","C05":"48","Status":"Pass"},{"student_id":"AM1701001008","name":"MOHAMMAD AIMAN BIN ABDULLAH","Sem":"4","Sec":"1","Chapter_Exam":"58","Practice skill":"41","Assignment":"83","Final_Exam":"41","Total":"53","Grade":"C","C01":"56","C02":"56","C03":"55","C04":"56","C05":"41","Status":"Pass"},{"student_id":"AM1701001009","name":"MOHAMMAD NASYRIK BIN OTHMAN","Sem":"4","Sec":"1","Chapter_Exam":"49","Practice skill":"44","Assignment":"74","Final_Exam":"41","Total":"50","Grade":"C","C01":"52","C02":"52","C03":"53","C04":"52","C05":"44","Status":"Pass"}];
		
		$('#data-table').DataTable({
			data  :  jsonData,
			columns :  [
				{ data : "student_id" },
				{ data : "name" },
				{ data : "Sem" },
				{ data : "Sec" },
				{ data : "Chapter_Exam" },
				{ data : "Practice skills" },
				{ data : "Assignment" },
				{ data : "Final_Exam" },
				{ data : "Total" },
				{ data : "Grade" },
				{ data : "C01" },
				{ data : "C02" },
				{ data : "C03" },
				{ data : "C04" },
				{ data : "C05" },
				{ data : "Status" }
			]
		});
	});
	</script>
    </body>
</html>

Open in new window

import2.php
<?php
error_reporting(E_ALL);
ini_set('display_errors', 1);


if ( ! empty($_FILES['csv_file']['name']) ) {

    $file_data = fopen($_FILES['csv_file']['name'], 'r');
    fgetcsv($file_data);

    while($row = fgetcsv($file_data) ) {
      
        if( count($row)>15):
            //now you know you have at least 16 element
            $data[] = array(
			'student_id'  => $row[0],
            'name'  => $row[1],
            'Sem'  => $row[2],
            'Sec'  => $row[3],
			 'Chapter_Exam'  => $row[4],
			  'Practice skill'  => $row[5],
			   'Assignment'  => $row[6],
			   'Final_Exam'  => $row[7],
			   'Total'  => $row[8],
			   'Grade'  => $row[9],
			   'C01'  => $row[10],
			   'C02'  => $row[11],
			   'C03'  => $row[12],
			   'C04'  => $row[13],
			   'C05'  => $row[14],
			    'Status'  => $row[15]
				);
        endif;
		};

    echo json_encode($data);
}

Open in new window

Mobile.csv
Avatar of Eddie Shipman
Eddie Shipman
Flag of United States of America image

Your data says this: "Practice skill"
Your grid is looking for: "Practice skills"
This question needs an answer!
Become an EE member today
7 DAY FREE TRIAL
Members can start a 7-Day Free trial then enjoy unlimited access to the platform.
View membership options
or
Learn why we charge membership fees
We get it - no one likes a content blocker. Take one extra minute and find out why we block content.