title: JQuery AJAX POST is not sending data to PHP file
body: <p>I have spent the whole of today trying to figure what is wrong with and I have read a lot of similar problems here but this seems to be a peculiar issue.</p>
  
  <p>I want an AJAX call to fill a dropdown list base on previous selection from MySQL database but it is not working as the POST is not sending any data to PHP <code>$id = $_POST['id']</code> file I am sending it to. However, if I assign a constant value to it (say <code>$id = 1</code>), it works just fine and return the expected data from the database. </p>
  
  <p>This is the AJAX code: </p>
  
  <pre><code>&lt;script type="text/javascript"&gt;
  $(document).ready(function()  
       { 
  
        $("#state").change(function()  
        {  
  
       var menuId = $(this).val();
  
          var request = $.ajax({
            url: "schools.php",
            type: "POST",
            data: { id : menuId },
            dataType: "html"
          });
  
          request.done(function( msg ) {
            $("#schools").html( msg ); 
          });
        });  
       });  
  &lt;/script&gt;
  </code></pre>
  
  <p>And the PHP code:</p>
  
  <pre><code>&lt;?php
  include('../connection.php');
  
  
  if(isset($_POST['id']) &amp;&amp; $_POST['id'] != '')
    {
        $id = $_POST['id']; 
        $SQ = "SELECT c_name FROM courses WHERE fac_id = ?";
    $q = $conn-&gt;prepare($SQ) or die("ERROR: " . implode(":", $conn-&gt;errorInfo()));
  
      $q-&gt;bindParam(1, $id);
      $q-&gt;execute();
      $total = $q-&gt;fetchAll();
  
      $i=1;
       foreach ($total as $sch){
          echo "&lt;option class = 'option' value = '$i'&gt;". $sch[0].&lt;/option&gt;";
          $i++;
        } 
  
  }
  
  ?&gt;
  </code></pre>
  
  <p>EDITTED:</p>
  
  <p>This the HTML code:</p>
  
  <pre><code>&lt;form class="form-horizontal"&gt;
      &lt;!-- Form Name --&gt;
  
      &lt;!-- Select Basic --&gt;
      &lt;div class="control-group"&gt;
        &lt;label class="control-label" for="selectbasic"&gt;State where your school is located&lt;/label&gt;
        &lt;div class="controls"&gt;
          &lt;select id="state" name="state" class="form-control input-xlarge"&gt;
          &lt;?php 
              $i=1;
            $SQ = "SELECT * FROM states";
            $schools = $conn-&gt;prepare($SQ);
            $schools-&gt;execute();
            $total = $schools-&gt;fetchAll();
            foreach ($total as $sch){
              echo "&lt;option class = 'option' value = '$i'&gt;". $sch[1]. "&lt;/option&gt;";
              $i++;
            }
  
            ?&gt;
  
          &lt;/select&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  
      &lt;!-- Select Basic --&gt;
      &lt;div class="control-group"&gt;
        &lt;label class="control-label" for="selectbasic"&gt;School&lt;/label&gt;
        &lt;div class="controls"&gt;
          &lt;select name="school" id = 'schools' class="form-control input-xlarge"&gt;
            &lt;?php 
              $i=1;
            $SQ = "SELECT * FROM schools";
            $schools = $conn-&gt;prepare($SQ);
            $schools-&gt;execute();
            $total = $schools-&gt;fetchAll();
            foreach ($total as $sch){
              echo "&lt;option class = 'option' value = '$i'&gt;". $sch[1]. "&lt;/option&gt;";
              $i++;
            }
  
            ?&gt;
          &lt;/select&gt;
        &lt;/div&gt;
      &lt;/div&gt;
  &lt;/form&gt;
  </code></pre>