I am trying to fix AJAX function to retrieve data from Wolfram Alpha API using the GET method in my form, but instead to transfering the data to the API handler file, the data is passed to the same page. Below is the CODE, please tell me where I am going wrong, been stuck here for 3 days without any result: simpleRequest.php
<html>
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<script>
function loadDoc()
{
var xmlhttp= window.XMLHttpRequest ?
new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");
xmlhttp.onreadystatechange = function() {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200)
document.getElementById("demo").innerHTML = xmlhttp.responseText; // Here is the response
}
var query = document.getElementById('q').value;
var queryString = "?q="+query;
xmlhttp.open("GET","handle.php" + queryString, true);
xmlhttp.send();
}
</script>
</head>
<body>
<form>
Search:
<input type="text" name="q" id="q" value="
<?php
$queryIsSet = isset($_REQUEST['q']);
if ($queryIsSet) {
echo $_REQUEST['q'];
};
?>"
> <input type="submit" onclick="loadDoc()" name="Search" value="Search">
</form>
<br><br>
<hr>
<div id="demo"></div>
Here is the php file to handle the API calls from Wolfram Alpha and display the result: handle.php
<?php
include '../wa_wrapper/WolframAlphaEngine.php';
?>
<?php
$appID = 'APP_ID';
//if (!$queryIsSet) die();
$qArgs = array();
if (isset($_REQUEST['assumption']))
$qArgs['assumption'] = $_REQUEST['assumption'];
// instantiate an engine object with your app id
$engine = new WolframAlphaEngine( $appID );
// we will construct a basic query to the api with the input 'pi'
// only the bare minimum will be used
$response = $engine->getResults( $_REQUEST['q'], $qArgs);
// getResults will send back a WAResponse object
// this object has a parsed version of the wolfram alpha response
// as well as the raw xml ($response->rawXML)
// we can check if there was an error from the response object
if ( $response->isError() ) {
?>
<h1>There was an error in the request</h1>
</body>
</html>
<?php
die();
}
?>
<h1>Results</h1>
<br>
<?php
// if there are any assumptions, display them
if ( count($response->getAssumptions()) > 0 ) {
?>
<h2>Assumptions:</h2>
<ul>
<?php
// assumptions come as a hash of type as key and array of assumptions as value
foreach ( $response->getAssumptions() as $type => $assumptions ) {
?>
<li><?php echo $type; ?>:<br>
<ol>
<?php
foreach ( $assumptions as $assumption ) {
?>
<li><?php echo $assumption->name ." - ". $assumption->description;?>, to change search to this assumption <a href="handle.php?q=<?php echo urlencode($_REQUEST['q']);?>&assumption=<?php echo $assumption->input;?>">click here</a></li>
<?php
}
?>
</ol>
</li>
<?php
}
?>
</ul>
<?php
}
?>
<hr>
<?php
// if there are any pods, display them
if ( count($response->getPods()) > 0 ) {
?>
<h2>Pods</h2>
<table border=1 width="80%" align="center">
<?php
foreach ( $response->getPods() as $pod ) {
?>
<tr>
<td>
<h3><?php echo $pod->attributes['title']; ?></h3>
<?php
// each pod can contain multiple sub pods but must have at least one
foreach ( $pod->getSubpods() as $subpod ) {
// if format is an image, the subpod will contain a WAImage object
?>
<img src="<?php echo $subpod->image->attributes['src']; ?>">
<hr>
<?php
}
?>
</td>
</tr>
<?php
}
?>
</table>
<?php
}
?>
</body>
</html>
Now whenever I click the search button, the GET data isn't passed to the handle.php instead, it is passed to the same page i.e simpleRequest.php as the url after clicking the search button shows: localhost/wolf/php/samples/simpleRequest.php?q=[StringToBeSearched]&Search=Search
Please tell where am I going worng, please keep in mind I am an AJAX beginner.
