title: dynamic drop-down not working
body: <p>I am trying to implement a dynamic drop-down list using Ajax and PHP. Based on the index value in the first option list, second one should give me list of names with that id.</p>
  
  <p>select1.php : </p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
  &lt;link rel="stylesheet" type="text/css" href="select_style.css"&gt;
  &lt;script type="text/javascript" src="js/jquery.js"&gt;&lt;/script&gt;
  &lt;script type="text/javascript"&gt;
  function fetch_select(val)
  {
   $.ajax({
   type: 'post',
   url: 'fetch1.php',
   data: {
    get_option:val
   },
   success: function (response) {
    document.getElementById("new_select").innerHTML=response; 
   }
   });
  }
  
  &lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body&gt;
  &lt;p id="heading"&gt;Dynamic Select Option Menu Using Ajax and PHP&lt;/p&gt;
  &lt;center&gt;
  &lt;div id="select_box"&gt;
   &lt;select onchange="fetch_select(this.value);"&gt;
    &lt;option&gt;Select ID&lt;/option&gt;
    &lt;?php
    $host = 'localhost';
    $user = 'admin';
    $pass = 'admin';
    $dbname='kancha';
    $conn = new mysqli($host, $user, $pass, $dbname);
    // Check connection
    if ($conn-&gt;connect_error) {
      die("Connection failed: " . $conn-&gt;connect_error);
    } 
  
    $sql = "select distinct id from test";
    $select= $conn-&gt;query($sql);
    if ($select-&gt;num_rows &gt; 0) {
      while($row = $select-&gt;fetch_assoc()) {
          echo "&lt;option value='".$row['id']."'&gt;".$row['id']."&lt;/option&gt;";
         //echo "&lt;option value=&gt;".$row['id']."&lt;/option&gt;";
      }
    } else {
      echo "0 results";
    }
    ?&gt;
   &lt;/select&gt;
  
   &lt;select id="new_select"&gt;
   &lt;/select&gt;
  
  &lt;/div&gt;     
  &lt;/center&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>fetch1.php </p>
  
  <pre><code>&lt;?php
  if(isset($_POST['get_option']))
  {
    $host = 'localhost';
    $user = 'admin';
    $pass = 'admin';
    $dbname='kancha';
    $conn = new mysqli($host, $user, $pass, $dbname);
    // Check connection
    if ($conn-&gt;connect_error) {
      die("Connection failed: " . $conn-&gt;connect_error);
    } 
  
    $id = $_POST['get_option'];
    //echo '$id';
   $sql = "select id, name from test where id='$id'";;
   $find= $conn-&gt;query($sql);
  
   if ($find-&gt;num_rows &gt; 0) {
      while($row = $find-&gt;fetch_assoc()) {
          //echo "&lt;option&gt;".$row['name']."&lt;/option&gt;";
          echo "&lt;option value='".$row['id']."'&gt;".$row['name']."&lt;/option&gt;";
      }
    } else {
      echo "0 results";
    }
   exit;
  }
  ?&gt;
  </code></pre>
  
  <p>My database looks something like this :</p>
  
  <pre><code>SELECT * from test; 
  id  name
  1   Name1
  2   Name2
  1   Name3
  </code></pre>
  
  <p>The first drop down works just fine. However the second drop down isn't working.
  I have attached the screenshot of it as well. Is there a problem in sending data across the files or what? Not able to figure out where has the code gone wrong.</p>
  
  <p>For the second option list, when I have selected <strong>1</strong>, I should be getting <strong>Name1</strong> and <strong>Name3</strong> as options but I get none. <a href="https://i.stack.imgur.com/pKqS2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/pKqS2.png" alt="enter image description here"></a></p>
  
  <p>EDIT: Corrected javascript in select1.php </p>