actualiser sans actualiser la page entière

J'ai créé 2 listes déroulantes qui sont remplies à partir de ma base de données. Dans la première goutte sont des pays et dans la seconde sont des villes. Lorsqu'un utilisateur sélectionne automatiquement un pays dans la seconde liste déroulante apparaît toutes les villes de ce pays. Le problème est que lorsque je sélectionne un autre pays, toute la page est rafraîchissante et je veux juste que 2 listes déroulantes pour faire l'actualisation. J'utilise Javascript et PHP. Voici les codes:actualiser sans actualiser la page entière

@$cat=$_GET['cat']; 




$quer2=mysql_query("SELECT DISTINCT category,cat_id FROM category order by category"); 

if(isset($cat) and strlen($cat) > 0){ 
$quer=mysql_query("SELECT DISTINCT subcategory FROM subcategory where cat_id=$cat order by subcategory"); 
}else{$quer=mysql_query("SELECT DISTINCT subcategory FROM subcategory order by subcategory"); } 




echo "<select name='cat' onchange=\"reload(this.form)\"><option value=''>Select one</option>"; 
while($noticia2 = mysql_fetch_array($quer2)) { 
if($noticia2['cat_id'][email protected]$cat){echo "<option selected value='$noticia2[category]'>$noticia2[category]</option>"."<BR>";} 
else{echo "<option value='$noticia2[cat_id]'>$noticia2[category]</option>";} 
} 
echo "</select>"; 
echo "&nbsp&nbsp"; 
echo "<select name='subcat'><option value=''></option>"; 
while($noticia = mysql_fetch_array($quer)) { 
echo "<option value='$noticia[subcategory]'>$noticia[subcategory]</option>"; 
} 
echo "</select>";

et c'est le code Javascript:

function reload(form) 
{ 
var val=form.cat.options[form.cat.options.selectedIndex].value; 
self.location='index.php?cat=' + val ; 
}

Je veux que quand je change le pays la toute page ne se recharge pas seulement les deux listes déroulantes. Toute aide sera très appréciée.

Source

2012-10-04 Bibu

Utilisez jQuery + Ajax au lieu de PHP, pour obtenir votre exigence. –

Salut à tous. Je pense que vous avez posé deux questions aujourd'hui sur l'utilisation de Google API pour déterminer la distance entre deux points, mais vous les avez supprimés. Gardez à l'esprit que si vous le faites trop souvent, votre compte peut être bloqué pendant un court moment en posant de nouvelles questions. – halfer

Vous devez utiliser ajax. Une suggestion très rudimentaire serait:

//self.location = '...' - removed 
ajax('index.php?cat=' + val).done(function (result) { 
    //update select boxes 
});

Source

2012-10-04 08:45:30

U peut utiliser Ajax pour acheving cela.

Pls vérifier ce lien Populate select list

Si U utilisent l'utilisation de jquery .ajax(). Exemple de jquery ajax sélectionnez Peupler la liste est Jquery Ajax Select List Populate

Source

2012-10-04 08:45:46 Gopesh

Essayez cette

index.php

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> 
<script type="text/javascript"> 
$(document).ready(function() 
{ 
$(".Select1").change(function() 
{ 
var id=$(this).val(); 
var dataString = 'your_param='+ your_param; 
$.ajax 
({ 
    type: "POST", 
    url: "select_2.php", 
    data: dataString, 
    cache: false, 
    success: function(html) 
    { 
    $(".Select2").html(html); 
    } 
    }); 

    }); 
    }); 
    </script> 

    <title>Untitled Document</title> 
    </head> 

    <body> 
    <?php 
    include("config.php"); 
    $sql="SELECT * FROM your_table"; 
    $result2 = mysql_query($sql); 
    ?> 
    <select class="Select1"> 
    <option value=""></option> 
    <?php 
    while($row2 = mysql_fetch_array($result2)) 
    { 
    ?> 
    <option value="<?php echo $row2['your_value']?>"><?php echo $row2['your_value']?> </option> 

    <?php 
    }    
    ?> 
    </select><br /> 
    <select class="Select2"></select> 
</body> 
</html>

Et select_2.php

<?php 
include('config.php'); 
if($_POST['your_param']) 
    { 
    $your_param=$_POST['your_param']; 
    $sql = mysql_query("SELECT * FROM yortable WHERE param = '".$your_param."'") or die(mysql_error()); 

while($row=mysql_fetch_array($sql)) 
{ 
$your_value=$row['your_param']; 
echo '<option></option>'; 
    echo '<option value="'.$your_value.'">'.$your_value.'</option>'; 

    } 
    } 

    ?>

Source

2012-10-04 10:48:52 Rakesh

Eh oui, vous allez besoin d'utiliser AJAX pour simplement mettre à jour une partie de la page. La façon la plus simple d'utiliser AJAX est de passer par JQuery. Here's their API for AJAX.

Source

2012-10-04 11:05:26

actualiser sans actualiser la page entière

Répondre

Questions connexes