title: How can I extract JSON data from PHP and display it in a datatable?
body: <p>I want to get reports from my database by using PHP via turning it into JSON format and displaying it with AJAX JQuery. But I can't seem to pass the data correctly. Can somebody please tell me my fault?</p>
  
  <p>Here is my code view:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>$(document).ready(function() {
  
    $("#searchOverall").click(function() {
  
  
      var ay = $("#Overall_acadyear").val();
      var year = $("#Overall_year").val();
  
      if (ay === undefined || ay == '') {
  
        alert("Select Academic year.");
  
      } else if (year === undefined || year == '') {
  
        alert("Select year level.");
  
      } else {
  
  
        $.ajax({
  
          url: "js/overallreport.php",
          dataType: "json",
          data: "ay=" + ay + "&amp;year=" + year,
          success: function(data) {
                   //left this blank because I am not sure of what I am doing.
                   //I used $.getJSON and $.each
          },
  
          error: function() {
            alert('Cannot retrieve data from server.');
          }
  
        }); //ajax
  
  
  
  
      } //else
  
    }); //btnOverall
  
  
  
  });
  //This is the JS FILE</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"&gt;&lt;/script&gt;
  &lt;div class="form-group col-sm-4"&gt;
    &lt;select class="form-control" id="Overall_acadyear"&gt;
      &lt;option value='' active&gt;Select AY&lt;/option&gt;
      &lt;?php $r-&gt;selectAcademicYear(); ?&gt;
    &lt;/select&gt;
  
    &lt;select class="form-control col-sm-4" id="Overall_year" align="right"&gt;
      &lt;option value='' active&gt;Select year level&lt;/option&gt;
      &lt;?php $r-&gt;selectYear(); ?&gt;
    &lt;/select&gt;
    &lt;div class="form-group"&gt;
      &lt;button type="button" class="control-label btn-success" id="searchOverall" name='createAccount'&gt;Search&lt;/button&gt;
      &lt;button type="reset" class="control-label btn-danger" id="reset"&gt;Clear Fields&lt;/button&gt;
    &lt;/div&gt;
  
    &lt;/th&gt;
  
    &lt;/tr&gt;
    &lt;tr&gt;
      &lt;th&gt;Student Number&lt;/th&gt;
      &lt;th&gt;Student Name&lt;/th&gt;
      &lt;th&gt;Section&lt;/th&gt;
      &lt;th&gt;Status&lt;/th&gt;
    &lt;/tr&gt;
    &lt;/thead&gt;
    &lt;tbody id="tableBody"&gt;
  
    &lt;/tbody&gt; &lt;!--This is the view file --&gt;</code></pre>
  </div>
  </div>
  </p>
  
  <pre><code>&lt;?php
  require($_SERVER['DOCUMENT_ROOT']."/finalsis/include/config.php");
  include_once($_SERVER['DOCUMENT_ROOT']."/finalsis/include/class.utility.php");
  header("Content-Type: application/json");
  $ay = $_GET['ay'];
  $year = $_GET['year'];
  
  $ay = $obj-&gt;cleanString($ay);
  $year = $obj-&gt;cleanString($year);
  
  
  $conn = mysqli_connect(db_server,db_user,db_password,db_database);
  $ay = mysqli_escape_string($conn,$ay);
  $year = mysqli_escape_string($conn,$year);
  
  $selectSQL = "SELECT studentlevel_student, student_fname, student_mname, student_lname,
  section_name, student_status FROM tblstudentlevel inner join
  tblstudent on studentlevel_student = student_number inner join
  tblyearsection on studentlevel_ys = ys_id WHERE studentlevel_acadyear = '" .$ay."' AND year_name = '" .$year. "'";
  $result = mysqli_query($conn,$selectSQL);
  
  $output = '{"student": [';
  while($rs = mysqli_fetch_array($result)){
          $name = $obj-&gt;getFullName($rs['student_fname'],$rs['student_mname'],$rs['student_lname']);
          $output .= '{"sno":"' .$rs['studentlevel_student']. '", ';
          $output .= '"name":"' .$name. '", ';
          $output .= '"section":"' .$rs['section_name']. '",';
          $output .= '"status":"' .$rs['student_status']. '"},';
      }
  
  $output .= "]}";
  mysqli_close($conn);
  echo json_encode($output);
  
   //This is where my data gathering happens. ?&gt;
  </code></pre>