Welcome to WebmasterWorld Guest from 3.229.122.166

Forum Moderators: open

Message Too Old, No Replies

Newbie problems: AJAX function problems

     
8:57 am on Sep 13, 2006 (gmt 0)

New User

10+ Year Member

joined:Sept 13, 2006
posts:1
votes: 0


Hello everyone:

I am having a really annoying problem with javascript and calling a function. I have asked many people but no one has been able to help me, but I still believe there is a simple solution somewhere.

This is how it works. I have a select box on a page. When onChange event is executed a function is called which sends a http request. The code returned is echo'd to produce another select box with more options.

This all works perfectly. The problem begins when I want to have two select box's output but with different names. So they have the same options, the same text, just different names. Simple as that. However I can't get it to work. Code as follows:

/************************* CODE ***********************/

<?php
include_once ("include/stdlib.php");
include ("include/stdcfg.php");
?>
<html>
<head> <title> test page </title>
<script language="javascript" type="text/javascript">

function createRequestObject() {

var req;

if(window.XMLHttpRequest){
// Firefox, Safari, Opera...
req = new XMLHttpRequest();
} else if(window.ActiveXObject) {
// Internet Explorer 5+
req = new ActiveXObject("Microsoft.XMLHTTP");
} else {
// There is an error creating the object,
// just as an old browser is being used.
alert('Problem creating the XMLHttpRequest object');
}

return req;

}

// Make the XMLHttpRequest object
var http = createRequestObject();

function sendRequest() {
// Open PHP script for requests
var mainCategory = document.getElementById("main_category").value;
http.open('get', 'getSubCategories.php?name=sub_category&param='+mainCategory);
http.onreadystatechange = handleResponse;
http.send(null);

sendRequest;

}

function sendRequest2() {
// Open PHP script for requests
var mainCategory = document.getElementById("main_category").value;
http.open('get', 'getSubCategories.php?name=second_sub_category&param='+mainCategory);
http.onreadystatechange = handleResponse;
http.send(null);

}

function handleResponse(element) {

if(http.readyState == 4 && http.status == 200){

// Text returned FROM the PHP script
var response = http.responseText;
alert(http.responseText);

if(response) {
// UPDATE ajaxTest content
document.getElementById(element).innerHTML = response;
}

}

}

</script>

</head>

<body>

<?php
echo "<form>";
echo "<select id='main_category' name='main_category' onChange='sendRequest();'>";
$result = runQuery("SELECT * FROM categories WHERE parent_category = ''");

while ($row = mysql_fetch_array($result)) {
$id = $row['id'];
$category = $row['category'];
echo "<option id='$id' value='$id'> $category";
}
echo "</select>";

echo "<div id='sub_category'></div>";

echo "</form>";

?>

</body>
</html>

/************************* END ***********************/

There we are then. I've tried everything that I can think off.

Originally I copied the code to call and create the select boxes, but that didn't work. I then tried giving the function a parameter, so I could call it twice but with a different name given:

<select onChange='sendRequest('box_1'); sendRequest('box_2');'>

That didn't work. I then tried coping and pasting the function sendRequest to sendRequest2, and calling the functions after one another - still doesn't work.

I've been stuck on this for 2 days now, and still no luck. As I said, I'm sure there must be a simple solution.

Simplicity is the key, as I have only just started learning ajax and even js too.

Thanks for all your help,
Gary.

10:41 am on Sept 13, 2006 (gmt 0)

Junior Member

10+ Year Member

joined:May 6, 2005
posts:74
votes: 0


I think I tried to do something similiar and failed.

So what I did I passed a variable to one function and did something based on the variable. Like this:

unction sendRequest(stuff) {
if stuff == dothingone {
// Open PHP script for requests
var mainCategory = document.getElementById("main_category").value;
http.open('get', 'getSubCategories.php?name=sub_category&param='+mainCategory);
http.onreadystatechange = handleResponse;
http.send(null);
}
else {
// Open PHP script for requests
var mainCategory = document.getElementById("main_category").value;
http.open('get', 'getSubCategories.php?name=second_sub_category&param='+mainCategory);
http.onreadystatechange = handleResponse;
http.send(null);
}
}

Does that make sense?

1:40 pm on Sept 13, 2006 (gmt 0)

Senior Member

WebmasterWorld Senior Member 10+ Year Member

joined:Sept 22, 2002
posts:1751
votes: 0


@redrabbit, you have a line with

sendRequest;

What happens when you change that into

sendRequest2();

? (I'm asking because I guess you want to call sendRequest2 from your sendRequest method).

Welcome to WebmasterWorld, by the way!

 

Join The Conversation

Moderators and Top Contributors

Hot Threads This Week

Featured Threads

Free SEO Tools

Hire Expert Members