homepage Welcome to WebmasterWorld Guest from 54.198.224.121
register, free tools, login, search, subscribe, help, library, announcements, recent posts, open posts,
Subscribe and Support WebmasterWorld
Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
Forum Library, Charter, Moderator: open

JavaScript and AJAX Forum

    
JS & Ajax works, but do not display correct
mysql, php, javascript, ajax, drop down list, textarea, select, div, reload
Petervn




msg:4457372
 1:49 pm on May 24, 2012 (gmt 0)

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...]

 

Fotiman




msg:4457405
 2:47 pm on May 24, 2012 (gmt 0)

Welcome to WebmasterWorld!
Note, the code you posted is subject to SQL Injection attacks, so I would advise you look into that.

Also, your script tag has a language attribute, which is invalid. Replace that with the type attribute, as in:

<script type="text/javascript">

I took a look at your page, and used Chrome's developer tools to inspect the XHR request and response. The request to getsc.php sends a response back that includes the entire document, including the DOCTYPE, <html>, <head>, scripts, etc., which contradicts the bit of PHP code you show above. Is there more code in getsc.php that you did not show above? Alternatively, is there some .htaccess stuff that happens that redirects requests to some site template code? "PSI'S MANAGEMENT SYSTEM"... seems to be the template/wrapper.

Petervn




msg:4457734
 9:32 am on May 25, 2012 (gmt 0)

Hello Fotiman, thank you for the welcome message!
I am new to php mysql and js, therefore not understanding the following two comments from your post: SQL Injection and .htaccess - I will Google these.

I have changed the <script type="text/javascript"> - thank you.

Above is now the complete code for getsc.php - I removed the require for the header. You will notice that I do not get any results if I make a selection from the Subcat after removing the reuire function from getsc.php

PSI's MANAGEMENT SYSTEM is a template that I am busy building in css.

Petervn




msg:4457770
 12:14 pm on May 25, 2012 (gmt 0)

SOLVED - There was code in the header which was conflicting with the ajax script when it load getsc.php into the div. I have renamed the file to header2.php and deleted the conflicting code. Now it seems to work like a charm. I Still have to include header2.php into getsc.php

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / JavaScript and AJAX
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About
© Webmaster World 1996-2014 all rights reserved