Details not displayed in modal using PHP and ajax

See more:

PHP

Ajax

jQuery

HTML5

Hey guys

I have a bootstrap modal in which I intend to display details of a clicked entry in a table. When user clicks on "Details" button of a particular entry, I post the Id value to a PHP page using Jquery and Ajax where some query is made to the DB to return details data in the modal.
I succeed in getting the Id with the Jquery code, but seems like this is not posted to the PHP page as defined in my Ajax code. As such I have nothing displayed in the modal, nothing but the Error message I defined if the Id value is not posted to the PHP page.

I couldn't succeed in finding out what I'm doing wrong. Thanks in advance for your help!

What I have tried:

Here's my code

HTML code:

<input type="button" name="select-students" value="Détails" id="<?php echo $row['sessionid']; ?>"class="btn btn-info select-students">

Ajax Code:

<script>
  $(document).ready(function(){
    $(document).on('click', '.select-students', function(){
      var sessionId = $(this).attr("id");
      alert(sessionId);

      if (sessionId != '') {
          $.ajax({
          url: "select_students.php",
          method : "POST",
          data : {sessionId:sessionId},
          success : function(data){
            $('#students').html(data);
            $('#detailmodal').modal('show');
          }
        });
      }
      else
      alert("Cannot display modal !");
    });
  });
</script>

PHP Code :

<?php
    if (isset($_POST["sessionId"])) {
        $output = '';
        //Fetching students who wrote a particular exam session
    $req = $db->prepare('SELECT distinct(Datesession),Code,sessionid,Startdate,Enddate from session');
    $req->execute();
    $donnee = $req->fetchAll();
    foreach ($donnee as $row) {

    $request = $db->prepare('SELECT name,surname,email  from candidat,session 
                             where sessionid= ' . $_POST["sessionId"]. ' ');
    $request->execute();
    $candidatId = $request->fetchAll();

    $rang = 1;
    $output .= '<div class = "table-responsive>"
    <table class="table table-bordered">
    <thead>
        <tr>
            <th>#</th>
            <th>Name</th>
            <th>Surname</th>
            <th>Email</th>
        </tr>
    </thead>
    <tbody>';

    foreach ($candidatId as $key) {
    $output .='
    <tr>
        <td>'.$rang.'</td>
        <td>'.$key['name'].'</td>
        <td>'.$key['surname']. '</td>
        <td>'.$key['email']. '</td>
    </tr>
    ';
    $rang = $rang + 1;
        }
    }
    $output .='
    </tbody>
    </table>
    </div>
    ';

    echo $output;
    }
    else
    echo "Erreur 404"
    ?>