Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

am trying to make a cascading dropdown, i want when a user select region then city dropdown is populated accordingly..

JS:

$(document).ready(function() {
    $('#region').change(function() {
        var region = $(this).val();
        $.post('get_region.php', {
            region: region
        }, function(data) {
            $('#district_div').html(data);
        });
    });

PHP:

<?php
require_once('../db/connect.php');

$region=$_POST['region'];

$q=mysql_query("select name from city where region='$region'");

$row=mysql_fetch_array($q);
echo $row['name']; 
?>

HTML*strong text*

 <div class="controls">

                       <select class="bootstrap-select" name="region" id="region">
                                          <option value="">Choose</option>
                                      //from database
                                          <?php echo $region_result; ?>

           </select>
  </div>

                       <select class="bootstrap-select" name="district" id="district" >

                             <div id='district_div'></div>         

          </select>
share|improve this question
 
What's your question? Also, seems like you're missing }) in js code –  mishik Jul 4 '13 at 17:35
 
So your are not retrieving data? –  Ricardo Gonzales Jul 4 '13 at 17:44
1  
my question is i dropdown is not populated onchage and where do i miss this ???? –  internally1 Jul 4 '13 at 17:44
 
am retrieving from mysql as u can see in ma php @RicardoGonzales –  internally1 Jul 4 '13 at 17:45
 
Is the element calling the function on change at least? –  Ricardo Gonzales Jul 4 '13 at 17:53
show 2 more comments

3 Answers

you mis some pieces

// will echo the name value of one row
    $row=mysql_fetch_array($q);
    echo $row['name']; 

try

$results = array();
while($row = mysql_fetch_array($q)){
$results[] = '<option>.'$row['name'].'</option>';
}
$optionString= implode(' ', $results);
echo $optionsString;
share|improve this answer
 
i changed, but nothn goes on onchange –  internally1 Jul 4 '13 at 18:07
 
can you post the html of the dropdown –  Miguelo Jul 4 '13 at 18:09
 
yap see my edit above...... –  internally1 Jul 4 '13 at 18:37
add comment

You are trying to write plain text inside a select box. Try to write in HTML format:

<option>name</option>

In your JS, replace the line:

$('#district_div').html(data);

With:

$('#district').html(data);

Delete the DIV with id "district_div". You cannot have a DIV inside a SELECT. In PHP, the last line is:

echo "<option>$row[name]</option>";
share|improve this answer
 
explain more plz –  internally1 Jul 4 '13 at 18:10
 
Try the code in my edit. –  Hernã Saldanha Jul 4 '13 at 22:57
add comment
-for JS it should be like this-

$(document).ready(function() {
    $('#region').change(function() {
        var region = $(this).val();
        $.post('get_region.php', {
            region: region
        }, function(data) {
            $('#district').html(data); // I change this part
        });
    });


-for php-

<?php
require_once('../db/connect.php');

$region=$_POST['region'];

$q=mysql_query("select name from city where region='$region'");

while($row = mysql_fetch_array($q)){
   echo "<option>".$row['name']."</option>";
}

?>


-for the html

<div class="controls">
   <select class="bootstrap-select" name="region" id="region">
      <option value="">Choose</option>
      //from database
      <?php echo $region_result; ?>
    </select>

     <select class="bootstrap-select" name="district" id="district" >

     </select>     <!--you don't need to put a div in the select tag-->
</div>
share|improve this answer
 
Can you explain the posted code a bit as well..? –  NREZ Aug 22 '13 at 9:58
 
what part of the code you didn't understand.? as you can see, I just edit the code posted. –  Ryan Aug 22 '13 at 17:20
 
Just some basic understanding of what you have modified... Would help make your answer better... –  NREZ Aug 23 '13 at 5:02
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.