Improve your registration forms by getting data from EGD

( This paper assumes that you have a basic understanding of web programming tools and techniques, such as Javascript, AJAX, PHP )


EGD now comes with a feature which allows web-masters to get players' data in a webservice flavor. Indeed, there are two scripts which you can directly call: Especially the latter, is very useful for setting up web forms where users have to enter players' data, for instance for events registration. Using these features it is quite easy to access the EGD database via an AJAX call, and get all the players' data. This can be very useful in order to get names' spelling validation and up to date player's GoR.
The only problem is that due to security issues, in both Internet Explorer and FireFox, the AJAX calls are not allowed to make cross-domain, cross-protocol, or cross-port requests. In other words, if you put into your web pages a standard AJAX call (i.e.: using the XMLHttpRequest object), your browser refuses to execute it unless the called url resides in the same domain as the calling page, This means that you cannot call the two EGD scripts directly from inside an HTML page in your own domain.
Luckily, it's quite easy to work around this issue. Assuming that you can write some server-side code in your domain (which is almost certainly true, since you are thinking of writing a web form), you can write an extremely simple AJAX proxy page, no longer than one line, which takes care of doing the call to the EGD scripts and returning back to your page the result.

For instance, if you are using PHP as server-side language, you can write this ProxyAjax.php file:

<?php echo(file_get_contents($_GET['url'])); ?>

Nothing else. If you are using server-side technologies other than PHP (such as .NET, Perl, JSP, ColdFusion, etc...) you want to do something similar, now you got the idea.
If you are security conscious, note that, in order to prevent malicious use of this script, you may want to perform some checks on the URLs it is supposed to serve. Otherwise, everybody may call it to get anonymous access to third-party pages.

So your ProxyAjax.php can look something like this:

<?php
if (substr($_GET['url'],0,33)=='http://www.europeangodatabase.eu/')
{ echo(file_get_contents($_GET['url']));
}
else
{ echo('Illegal URL; your request has been logged');
  // Do something here if you really want to log unauthorized accesses
}
?>

Now, you can simply make an AJAX call to this ProxyAjax.php file passing the url you actually wanted to call.
For instance, save in the main folder of your domain this PHP script, then try clicking:

http://your.domain.com/ProxyAjax.php?url=http://www.europeangodatabase.eu/EGD/GetPlayerDataByData.php?lastname=poda%26name=an

you'll get exactly the same data that you would have got from the EGD script (please note that "%26" is the HTML code for the ampersand "&". I put it in order to prevent breaking the 'url' parameter).

Now, it's very simple to put all together :


Demo

To see all this in action, look at the example below; try typing in some letters in the last name field, and see what happens: after the third letter, a combo appears with the list of all the players (if any) whose last names match the string typed in. Adding more letters, the search is dinamically refined. Select one of the entries clicking on it, and all the other fields will be automagically filled :

Last Name: Name:

Club: Country:

PIN: Strength: GoR:


Imagine to have this little form in your tournament registration page: nice, isn't it ?
You can simply copy & paste the source code from this page, including all the Javascript code (and the style too, if you like it), and put it into your website's folders.
The only other thing you need is the one-line-long ProxyAjax.php.

That's all.

Start playing around, and let me know feedback and suggestions:   aldo.podavini@europeangodatabase.eu


Go back