刷新而不刷新所有頁面

我做了2個從我的數據庫填充的下拉列表。第一滴是國家，第二滴是城市。當用戶在第二個下拉菜單中自動選擇一個國家時，會顯示該國家的所有城市。問題是，當我選擇另一個國家所有的頁面刷新，我只想要2下拉列表進行刷新。我正在使用JavaScript和PHP。下面是代碼：刷新而不刷新所有頁面

@$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>";

，這是Javascript代碼：

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

我想，當我改變這個國家的所有網頁不刷新只有2下拉列表。任何幫助都感激不盡。

來源

2012-10-04 Bibu

使用jQuery + Ajax代替PHP來獲得您的需求。 –

你好。我想今天你問了兩個關於使用Google API來確定兩點之間的距離的問題，但是你刪除了它們。請記住，如果您經常這樣做，您的帳戶可能會因提出新問題而暫時鎖定。 – halfer

您需要使用ajax。一個非常基本的建議是：

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

來源

2012-10-04 08:45:30

你可以使用Ajax來達到這個目的。

PLS如果妳使用jQuery使用.ajax()檢查此鏈接Populate select list

。 jQuery的阿賈克斯選擇列表中填入的例子是Jquery Ajax Select List Populate

來源

2012-10-04 08:45:46 Gopesh

試試這個

的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>

而且在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>'; 

    } 
    } 

    ?>

來源

2012-10-04 10:48:52 Rakesh

是的，你要去需要使用AJAX才能更新部分頁面。使用AJAX最簡單的方法是通過JQuery。 Here's their API for AJAX。

來源

2012-10-04 11:05:26

刷新而不刷新所有頁面

回答

相關問題