make refresh without refreshing the all page
<p>I made 2 dropdownlists which are filled from my database. In the first drop are countries and in the second are cities. When a user selects a country automatically in the second drop down appears all the cities from that country. The problem is that when I select another country all the page is refreshing and I want just that 2 drop down lists to do the refresh. I'm using Javascript and PHP. Here are the codes:</p>

<pre><code>@$cat=$_GET['cat']; 




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

if(isset($cat) and strlen($cat) &gt; 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 "&lt;select name='cat' onchange=\"reload(this.form)\"&gt;&lt;option value=''&gt;Select one&lt;/option&gt;";
while($noticia2 = mysql_fetch_array($quer2)) { 
if($noticia2['cat_id']==@$cat){echo "&lt;option selected value='$noticia2[category]'&gt;$noticia2[category]&lt;/option&gt;"."&lt;BR&gt;";}
else{echo  "&lt;option value='$noticia2[cat_id]'&gt;$noticia2[category]&lt;/option&gt;";}
}
echo "&lt;/select&gt;";
echo "&amp;nbsp&amp;nbsp";
echo "&lt;select name='subcat'&gt;&lt;option value=''&gt;&lt;/option&gt;";
while($noticia = mysql_fetch_array($quer)) { 
echo  "&lt;option value='$noticia[subcategory]'&gt;$noticia[subcategory]&lt;/option&gt;";
}
echo "&lt;/select&gt;";
</code></pre>

<p>and this is the Javascript code:</p>

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

<p>I want that when I change the country the all page doesn't refresh only those 2 drop down lists. Any help will be much appreciated. </p>
