NerdyHearn
Home
Blog

Contact
Mailing List

Software

Active Directory Products
Object Compare
Permission Compare

IPhone Products
Calls To Calendar
SMS To CSV
SMS To Gmail
Voicemail To Gmail

Sites
DocuTerminal
How Long For Me
My Music To Me
SaveMySerials
TypeCount

Blog
Twitter

NerdyHearn - Blog


<< Back To All Blogs

Implementing AJAX with PHP and MySQL

Saturday, June 17th, 2006

I thought I would post about the recent AJAX addition to my site, that active search. AJAX is not a technology, it is a methodology of making programmatic callbacks from javascript functioning, using XML and HTML. How it works is an event is set for a textbox, textarea, body event, button click, etc. Within this event there is a callback to another javascript function that loads, processes, or does whatever necessary to the page that is called, and returns the results via javascript. In my case, I completed my first script as follows:


The form action is contained as follows:
<form action="search.php" method="get">

The textbox is defined as follows:
< label for="query">
< input type="text" style="text-align: center;" name="search" autocomplete="off" id="query" onKeyUp="preSearch()" />
< /label>

Now comes the fun part, the javascript function preSearch is defined as follows:
< script language="javascript">
var xmlhttp = false;

if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
xmlhttp.overrideMimeType('text/xml');
} else if (window.ActiveXObject) {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}

function preSearch() {
var theQuery = document.getElementById('query').value ;

if(theQuery !== "") {
document.getElementById('result').innerHTML = "Searching...";
var url = 'search.php?q=' + theQuery;
xmlhttp.open('GET', url, true);
xmlhttp.onreadystatechange = function() {
if(xmlhttp.readyState == 4 && xmlhttp.status == 200) {
document.getElementById('result').innerHTML = xmlhttp.responseText + ' ';
} else {
//document.getElementById('result').innerHTML = 'Error: preSearch Failed!';
}
};
xmlhttp.send(null);
}
}
< /script>

After you have implementing all of the above properly, the only other part you have to complete is your php or html page that will print the results, in this cause I have called it to search.php, which contains the following code:

< ?
require("includes/class_connect.php");

if (empty($q)) {
Header("Location: index.php");
} else {
$connection->doQuery("SELECT * FROM news WHERE news LIKE '%$q%' LIMIT 10");
$results = $connection->getAllData();

if (!empty($results)) {
$count = 1;
foreach ($results as $result) {
?>
< ?=$count?>) < a href="?mod=news&id=<?=$result["id"]?>">< ?=substr($result["news"], 0, 17)?>...< /a>< br />
< ?
$count++;
}
?>
< br />
< ?
} else {
?>
< center>< b>No results found.< /b>< /center>
< br />
< ?
}
}
?>

While AJAX is a very cool aspect to add to your webpage, there are implications. The constant callbacks to pages that are searching content from an AJAX-enabled page do add a large amount of traffic for the server to handle. This is why you don't see alot of larger sites using AJAX (Yet). There is research in progress to solve this problem using Caching as well as some other pretty cool technologies. Another issue is security, I won't get too in-depth into this right now because looking at my code above I can already think of a few ways to exploit the code to gain un-wanted access on some content of my website.

That's my speal on AJAX for now, I am also currently playing with AJAX.NET which will alow for the use of AJAX within ASP.NET pages written in VB.NET and C#. More to come soon. Let me know if you think there are ways to improve what I have written above. Cheers.

Tags

PHP Databases

Related Blogs

Netbeans and PHP: A promising future
Simple encryption class for PHP
Resolving CURLOPT_FOLLOWLOCATION cannot be activated with PHP and CURL
Parsing XML in PHP with SimpleXML
Calling .NET WebService From PHP

Comments

Currently no comments.

Add A Comment

Name:


URL:


Email Address: (not public, used to send notifications on further comments)


Comments:



Enter the text above, except for the 1st and last character:


NerdyHearn - Latest tech news relating to C#, ASP.NET, SharePoint, PHP, general development, and more. DocuTerminal - Online Filing Cabinet solution. Scan, search and archive your paper documents. SaveMySerials - Protect yourself from theft, fire, natural disasters and more by recording your serial numbers My Music To Me - Stream your subsonic music collection to your Sonos wireless system TypeCount - Count how often you type across different computers! ServrTrackr - Monitor your SSL certificates, website uptime, and DNS configurations