使用select1上的选定值填充select2，而不刷新页面或使用按钮

Question

I'm a Beginner on PHP, Javascript, I would like to fill select "info" using selected value on select "peoplesnames" without refresh page or using a button

this is my code

HTML:

<select id="peoplesnames" name="peoplesnames" onchange=" $person<<--Somthings here to get selected ">

   ` <option value="1">john</option>`
    `<option value="2">sarah</option>`
   ` <option value="3">samantha</option>`
`</select>`

PHP

<?php

echo '<select style="width: 110px; name="infos">';

$requete = mysql_query('SELECT city FROM people where id=$person');

$requete2 = mysql_query('SELECT age FROM people where id=$person');

$nmbrrows = mysql_numrows($requete);

for ($i=0; $i<$nmbrrows ; $i++) {

$city = mysql_result($requete,$i);

$age = mysql_result($requete2,$i);

echo '<option value="'.$age.'"> '.$city.' </option>';

}

echo '</select>';

?>

what need I add to my code? please tell me if there is another solution, Thanks

Answer 1

I would suggest doing some jQuery to detect a change event on the select box, and then detecting what the selected value is.

On the backend i would create a PHP end point that received the selected id/value, and returned the SQL results you want.

Using the on change event, pass the selected value to your php code using Jquery $.post and then take the response and update a division on your page with that users info.

An Example would be:

$("#peoplesnames").change(function(){
    var id = $('#peoplesnames :selected').val();
    $.post( "test.php", { id: id}).done(function( data ) {
          $("#info p").text(data);
       });

});

This will detect when the select value has changed, grab the value of the selected item, pass that value to your PHP script, take the response from it and add it to a <p> tag in the #info division.

You PHP Script could look something like:

<?php
   $id = $_POST['id'];
   $request = mysql_query('SELECT * FROM people where id = $id');
   $data = mysql_result($request);

   $response = "The person named ".$data['name']." is ".$data['age']." and lives in ".$data['city']." Happily everafter.";
   return $response;

 ?>

You of course will need to format that however you want, but that should pull in the specific person's data and populate a division each time you change the combobox's selection.