I have used ajax scripts to load catagories out of mysql on a onChange event using a select box. The script will then get another file and display it on the same page inside a div without reloading the page. It all works fine, accept that it grabs part of the top menu and display it in the div as well. I have spend hours trying to figure out why but cannot get it to work. The only logical reason is that the scripts might clash with the jquery used for the menu at the top of the page.
Here is the code:
HEADER CODE:
<SCRIPT language=JavaScript>
function reload(form){
var val=form.cat.options[form.cat.options.selectedIndex].value;
self.location='update.php?cat=' + val ;
}
//ajax script to load subcat values
function showUser(str)
{
if (str=="")
{
document.getElementById("subcatdetails").innerHTML="";
return;
}
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
document.getElementById("subcatdetails").innerHTML=xmlhttp.responseText;
}
}
xmlhttp.open("GET","getsc.php?q="+str,true);
xmlhttp.send();
}
</script>
GETSC.PHP:
<?php
$q=$_GET["q"];
$sql="SELECT * FROM subcat WHERE subcat = '".$q."'";
$result = mysql_query($sql);
while($row = mysql_fetch_array($result))
{
echo $q"
<form>
<b>SUB</b> Category to be inserted under the following <b>MAIN</b> Category:<br>
<select name=industry value=industry class='textfield'>
<option value='select'>Please select...</option>
</select><br>
Price:
<input name='price' type='text' class='textfield' id='price' value=".$row['price']." /><br>
Edit or Add Description:<br>
<textarea name='desc' id='desc' />" .$row['desc']."</textarea><br>
<input name='update_sub' type='submit' value='Update Sub Category' class='button'><br>
OR<br><br>
<input name='update_main' type='submit' value='Delete Record' class='button'>
</form>";
}
mysql_close($con);
?>
WHERE RESULT MUST DISPLAY:
<div class="rightcontent">
<form action="./edit_comp.php" method="post" class="style">
Select a <b>SUB</b> Category to edit:<br>
<?php
////////// Starting of second drop downlist /////////
echo "<select name='users' onchange='showUser(this.value)'><option value=''>Select SUB Category</option>";
while($noticia = mysql_fetch_array($quer)) {
echo "<option value='$noticia[subcat]'>$noticia[subcat]</option>";
}
echo "</select>";
////////////////// This will end the second drop down list ///////////
?><br>
</div>
<div class="rightcontent" id="subcatdetails">
</div>
You can view online at: [
bapple.co.za...]