AJAX is dumb
The deal with AJAX is, that JavaScript is so far behind that you need huge libraries to do anything good. One of the things they always make are auto-updating search boxes where they search the database as you type. Here is the same thing in Flash, but without the 180K of Prototype and Scriptaculous. I know you can compress it down but this will compile down to about 4k but maybe a little bigger depending on what kind of button you have. I do make HTML sites, but some of these examples are just crazy.
var samples:Array = ["suggestion1", "suggestion2", "suggestion3"];
var myString:String = samples[random(samples.length)];
var inField:Boolean = false;
var loader:LoadVars = new LoadVars();
var txt:TextField; // the search box
var suggestedTxt:TextField;
txt.text = myString;
txt.onSetFocus = function(){
if( this.text == myString ){
this.text = ""; inField = true;
}
}
txt.onKillFocus = function(){ if(this.text == ""){
myString = samples[random(samples.length)];
inField = false; this.text = myString; }
}
var btn:MovieClip;
btn.onRollOver = function(){ this.gotoAndStop(2); }
btn.onRollOut = function(){ this.gotoAndStop(1); }
btn.onRelease = function(){
getURL( "/search.php?query="+txt.text );
}
var keyListener = new Object();
keyListener.onKeyDown = function(){
if( Key.getCode() == Key.ENTER && txt.text != myString && txt.text != "" ){
getURL("/contact/search/?query="+txt.text);
}else if( inField ){
loader.onLoad = function(){
// this is the response from the server
_root.suggestedTxt.text = this;
}
loader.load( "/search.php?query=" + txt.text );
}
};
Key.addListener(keyListener);
Labels: actionscript, ajax

3 Comments:
This comment has been removed by the author.
This comment has been removed by the author.
Same thing, less then 2k using AJAX.
<html>
<head>
<title>Simple AJAX</title>
</head>
<body>
<script>
// this script is now compatable with internet explorer. yay.
if (!XMLHttpRequest) {
function XMLHttpRequest () {
return(new ActiveXObject('Microsoft.XMLHTTP'));
}
}
// create a new xhr object
var xhr = new XMLHttpRequest;
// each keypress in the input box calls this function
function updateUnderbox () {
xhr.open('GET', 'http://localhost/cp3zer0.com/examples/simpleajaxquery.php?what=' + document.getElementById('textbox').value, true);
xhr.onreadystatechange = function () {
// if the data is ready
if (xhr.readyState == 4 && xhr.status == 200) {
var response = eval('(' + xhr.responseText + ')'), finishedHTML = '';
// parse it into links yay
for (suggestion in response) {
var finishedHTML = finishedHTML + '<a href="javascript:useSuggestion(\'' + response[suggestion] + '\');">' + response[suggestion] + '</a><br />';
}
// put it in the underbox
document.getElementById('underbox').innerHTML = finishedHTML;
}
};
xhr.send(''); // make the request
}
// clicking a link in the response uses it
function useSuggestion (suggestion) {
document.getElementById('textbox').value = suggestion;
}
</script>
<input id="textbox" type="text" onKeyUp="updateUnderbox()" />
<div id="underbox"></div>
</body>
</html>
Post a Comment
Subscribe to Post Comments [Atom]
<< Home