Forum Moderators: open
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¶m='+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¶m='+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.
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¶m='+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¶m='+mainCategory);
http.onreadystatechange = handleResponse;
http.send(null);
}
}
Does that make sense?
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!
