Utiliser un document.getElementById dans une requête ou d'une autre manière pour le faire

Question

Je dois insérer une valeur obtenue à partir d'un document.getElementById dans une requête sql. Je dois faire ceci parce que j'essaye de remplir automatiquement une deuxième boîte d'entrée selon le résultat du premier (c.-à-d. Si je tape Rome dans le premier je voudrais que le deuxième remplisse automatiquement avec le pays lié trouvé dans mon DB , comme l'Italie)

Voici le code:

<?php 
    echo (" <form NAME='Form1' id='Form1' method=post class=statsform action=page.php > "); 
    echo (" <input type=text name=city id=city size=50 class=formfield value='$city' onBlur='Assigncode();' > "); 
    echo (" <input type=text name='Country' id='Country' size=12 value='$Country' > "); 
?> 
<script> 
function Assigncode() { 
    var elemento = document.getElementById("city");  
    var elementoCod = document.getElementById("Country");  
    if (elemento != null && elemento.value != '') { 
     var city = elemento.value; 
     if (elementoCod == null || elementoCod.value == '') { 
      <?php 
$query2 = "SELECT * FROM table WHERE city = 'put here the getElementById of the city' "; 
$result2 = MYSQL_QUERY($query2); 
$i2 = 0; 
    $country  = mysql_result($result2,0,"T_Country"); 
    ?> 

      eval("document.Form1. Country").value = '<?php echo($country)?>'; 
     } 
    } 
} 
</script> 

Toute suggestion? Merci

Answer 1

Voici une version légèrement modifiée d'un exemple de script AJAX trouvé sur Wikipedia. Cela devrait vous donner l'idée de base sur la façon de procéder. Si vous utilisez jQuery, une grande partie de ce JavaScript pourrait être réduite à quelques lignes.

// This is the client-side javascript script. You will need a second PHP script 
// which just returns the value you want. 

// Initialize the Http request. 
var xhr = new XMLHttpRequest(); 
xhr.open('get', 'send-ajax-data.php?city=' + elemento.value); 

// Track the state changes of the request. 
xhr.onreadystatechange = function() { 
    var DONE = 4; // readyState 4 means the request is done. 
    var OK = 200; // status 200 is a successful return. 
    if (xhr.readyState === DONE) { 
     if (xhr.status === OK) { 
      document.Form1.Country.value = xhr.responseText; // 'This is the returned text.' 
     } else { 
      alert('Error: ' + xhr.status); // An error occurred during the request. 
     } 
    } 
}; 

// Send the request to send-ajax-data.php 
xhr.send(null); 

d'envoi ajax-data.php:

<?php 
$city = $_GET['city']; 
$query2 = "SELECT * FROM table WHERE city = '$city'"; 
$result2 = MYSQL_QUERY($query2); 
$country = mysql_result($result2,0,"T_Country"); 
echo $country; 

Par ailleurs, la variable $ city doit être validée et a échappé avant de l'utiliser dans une requête SQL.