Populating second dropdown on the same page

Question

I am trying to populate a second dropdown based on first on the same page without having to call any external PHP script. I have been testing ajax but it is not working, it has to call another PHP script externally.

I have states, so when a state is clicked it populates the second dropdown with the locality for that state from the db the first dropdown is working properly but the second isn't working. This is my code, been trying ajax nothing works.

I want to echo the value from the db on the same page without calling any external PHP script. How can I pass the first dropdown value to the second dropdown PHP code below for query to the db? Not calling another PHP file externally, all on the same page?

       //first dropdown//
<select name="state" class="select" >
     <option selected>State</option>
        <?php 
  $u =  "SELECT * FROM state_id";
  $sql = mysqli_query($con, $u);
  while ( $row = mysqli_fetch_assoc($sql)) 
  {
 echo '<option>'.$row['name'].'</option>';
 }
 ?>

        </select>
        </div>
      </div>
          <div class="col-md-2">
        <div class="aa-single-advance-search">
           <!-- second dropdown on the same page -->

              <select name="locality" class="select2">
              <option selected>Location</option>
                                 <?php 
                                //local area is the table i am getting localities based on state value in the first select menu//
      $u =  "SELECT name FROM local_area WHERE state_id='$id'";
        $sql = mysqli_query($con, $u);
         while ( $row = mysqli_fetch_assoc($sql)) 
      {
         echo '<option>'.$row['name'].'</option>';
     }
      ?>
              </select>

You are using a string value for ID , Did you use string AS IS in your database ? — Nuhel, Jun 20 '16 at 18:03
no i did not. no i just created the variable for testing purposes but it did not work wanted to see if the id would collect the first drop down value it just ignores.please ignore it thanks @Nuhel — , Jun 20 '16 at 18:41

score 1 · Answer 1 · edited May 23 '17 at 11:48

A common mistake (perhaps not one you are encountering, but fwiw) is to think the PHP code can somehow run the AJAX. Not true. Once the page is rendered, PHP cannot run. That's where javascript comes in, and that's why AJAX is started in js/jQuery.

Note that jQuery is a library that you reference/load on your page. Not only is it 30% less typing (that fact alone is a good enough reason to use it), but it is also automatically cross-browser. More importantly, jQuery makes AJAX easy.

Study this (working) example. Perhaps even reproduce the example on your server and monkey around with it a bit. Turn the example into your own solution.

Populate dropdown B based on selection in dropdown A

score 0 · Answer 2 · edited Sep 24 '16 at 11:47

0

I did little work and it worked but what confused me was the relationship between the external php script and the second dropdown.

edited Sep 24 '16 at 11:47

halfer

19,824
17
99
186

answered Jun 24 '16 at 00:38

Populating second dropdown on the same page

2 Answers2