Aqua-Soft Forums

Ajap

Ok, so i have a basic page with source that looks something like this:

index.php

<html>
	<head>
		<title>Ajap Test</title>
		<script language="JavaScript" src="../../unavailable.html"></script>
	</head>
	<body>
		This page loads content asychronously.

		<a href="../../unavailable.html">Click here to load red data.</a>

		<a href="../../unavailable.html">Click here to load blue data.</a>

		<div id="loadspace1">
		</div>
	</body>
</html>

This references a php file, masquerading as a java script file, in order to load data from the server, in a similar style to AJAX, but without and XML, just php, hence "AJAP".

I use a PHP file to query a MySQL database, and return the results of the query using JavaScript.

However my problem is that i can't dynamically change the MySQL query from index.php

script.php

<?php
	$supplier = $_REQUEST['s'];
	include("connect.inc.php");
	@mysql_select_db($database) or die( "Unable to select database");
	$query="SELECT * FROM products WHERE supplier='$supplier' ORDER BY name ASC";
	$result=mysql_query($query);
	$num=mysql_numrows($result);
	$i=0;
	$data='';
	mysql_close();

	while ($i < $num) {
		$productname=mysql_result($result,$i,"name");
		$data= $data."
".$productname;
		$i++;
	}

echo<<<END
	function dataload(id,color){
		var data="$data";
		document.getElementById(id).innerHTML = data;
		document.getElementById(id).style.color = color;
	}
END;
?>

Now you can see that in index.php i can pass a static variable to script.php, by appending ?s=Alex to the URL. However, i want to be able to pass a dynamic variable to script.php, so that the script will select different items from the database depending on that variable, and load them into the page without reloading.

To put it into context, this database contains a load of items with a value assigning them to different categories.

I want to load items onto the page, AJAX style, but i want the user to be able to choose which category of items is loaded. In order for the correct items to be loaded, i need to pass different values to the PHP so that the MySQL functions will select the right data. Sending the value in the head of the script means i can't change it without reloading the page, which would defeat the whole point of doing this.

Does anybody know a way i might be able to do this?

Thanks in advance.

#422541

You don't seem to grasp the concept of ajax. This is simply a static request, you need to do a dynamic request in javascript with the XMLHttpRequest object (hence the name async. javascript and xmlhttprequest blabla). With the XMLHttpRequest object, you make a request to fetch the contents of a webpage/XML document. Here is where you can give the URL with querystring holding the variables that the dynamically generated (by PHP) webpage/XML doc will use to fill the contents of the page being sent back to the XMLHttpRequest object and received by your JS code.

On a different note: your PHP code is highly unsafe: search for SQL injection prevention [mysql_real_escape].

#422571

You don't seem to grasp the concept of ajax. This is simply a static request, you need to do a dynamic request in javascript with the XMLHttpRequest object (hence the name async. javascript and xmlhttprequest blabla). With the XMLHttpRequest object, you make a request to fetch the contents of a webpage/XML document. Here is where you can give the URL with querystring holding the variables that the dynamically generated (by PHP) webpage/XML doc will use to fill the contents of the page being sent back to the XMLHttpRequest object and received by your JS code.

On a different note: your PHP code is highly unsafe: search for SQL injection prevention [mysql_real_escape].

Thanks, yes, i understand that this isn't AJAX, but i'm just using it as a comparable method, in that the end result, as far as the user is concerned, is similar, with different data being able to be loaded into the same page without reloading it, based on user input.

Since i posted this topic i have found a way to send variables from the page to the script, so i've pretty much solved my problem, generating what i think you could call a dynamic request. I'll put up the code in a bit. This means i can now send a query to the PHP, using JavaScript to generate that initial query, in turn triggering a MySQL query, which will in turn pass the result of the query to the JS, which will send it back to the page the user is viewing.

In retrospect it seems wholey innefficient so i think i may just go back to the "traditional AJAX". Interesting learning experience though :P

P.S. Don't worry it's only illustrative code! There's a lot of other things to it that i've cut out. I'm aware of MySQL injection. Still, I appreciate you mentioning it.

P.P.S. And yes in essence this may be considered a static request, i'm just abusing the word dynamic :, or rather, using it in the way that people describe php pages as "dynamic".

EDIT:

My new script.php

<?php
	$id = $_REQUEST['id'];
	include("connect.inc.php");
	@mysql_select_db($database) or die( "Unable to select database");
	$query="SELECT * FROM products WHERE id='$id' ORDER BY name ASC";
	$result=mysql_query($query);
	$num=mysql_numrows($result);
	$i=0;
	$data='';
	mysql_close();

	while ($i < $num) {
		$productname=mysql_result($result,$i,"name");
		$data= $data."
".$productname;
		$i++;
	}

echo<<<END
	function dataload(dynamicphpvars,id,color){
		var html_doc = document.getElementsByTagName('head').item(0);
		var js = document.createElement('script');
		js.setAttribute('language', 'javascript');
		js.setAttribute('type', 'text/javascript');
		js.setAttribute('src', dynamicphpvars);
		html_doc.appendChild(js);
		var data="$data";
		document.getElementById(id).innerHTML = data;
		document.getElementById(id).style.color = color;
	}
END;
?>

Corresponding link in index.php

<a href="../../unavailable.html">Call Data</a>

#422572

<script language="JavaScript" src="../../unavailable.html"></script>

This may work...

#422597