According to Daniel Tulp, I will share my AJAXs in this room.
and we can understand quickly how AJAX works.
Now I show you an AJAX example: Username checker.
As you know, the registration form of Joomla can not check instantly if a username already in use. To do this, we use AJAX function. These are steps I did:
2-Hack registration.html.php in components/com_registration folder (line 77 -> 134, line 185 -> 186).
<?php
/**
* @version $Id: registration.html.php 4343 2006-07-27 19:28:05Z rmuilwijk $
* @package Joomla
* @subpackage Users
* @copyright Copyright (C) 2005 Open Source Matters. All rights reserved.
* @license
http://www.gnu.org/copyleft/gpl.html GNU/GPL, see LICENSE.php
* Joomla! is free software. This version may have been modified pursuant
* to the GNU General Public License, and as distributed it includes or
* is derivative of works licensed under the GNU General Public License or
* other free or open source software licenses.
* See COPYRIGHT.php for copyright notices and details.
*/
// no direct access
defined( '_VALID_MOS' ) or die( 'Restricted access' );
/**
* @package Joomla
* @subpackage Users
*/
class HTML_registration {
function lostPassForm($option) {
// used for spoof hardening
$validate = josSpoofValue();
?>
<form action="index.php" method="post">
<div class="componentheading">
<?php echo _PROMPT_PASSWORD; ?>
</div>
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="contentpane">
<tr>
<td colspan="2">
<?php echo _NEW_PASS_DESC; ?>
</td>
</tr>
<tr>
<td>
<?php echo _PROMPT_UNAME; ?>
</td>
<td>
<input type="text" name="checkusername" class="inputbox" size="40" maxlength="25" />
</td>
</tr>
<tr>
<td>
<?php echo _PROMPT_EMAIL; ?>
</td>
<td>
<input type="text" name="confirmEmail" class="inputbox" size="40" />
</td>
</tr>
<tr>
<td colspan="2">
<input type="submit" class="button" value="<?php echo _BUTTON_SEND_PASS; ?>" />
</td>
</tr>
</table>
<input type="hidden" name="option" value="<?php echo $option;?>" />
<input type="hidden" name="task" value="sendNewPass" />
<input type="hidden" name="<?php echo $validate; ?>" value="1" />
</form>
<?php
}
function registerForm($option, $useractivation) {
// used for spoof hardening
global $mosConfig_live_site;
$validate = josSpoofValue();
?>
<script language="javascript" type="text/javascript">
function ajaxFunction()
{
var xmlHttp;
try
{
// Firefox, Opera 8.0+, Safari
xmlHttp=new XMLHttpRequest();
}
catch (e)
{
// Internet Explorer
try
{
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch (e)
{
try
{
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch (e)
{
alert("Your browser does not support AJAX!");
return false;
}
}
}
var url="<?php echo $mosConfig_live_site;?>";
url=url+"/usernamehint.php?username=";
url=url+document.getElementById("uname").value;
xmlHttp.onreadystatechange=function()
{
if(xmlHttp.readyState==4)
{
var r=xmlHttp.responseText;
if (r != "")
document.getElementById("unameHint").innerHTML=r;
}
}
xmlHttp.open("GET",url,true);
xmlHttp.send(null);
}
function clearcheck()
{
document.getElementById("unameHint").innerHTML="";
} function submitbutton_reg() {
var form = document.mosForm;
var r = new RegExp("[\<|\>|\"|\'|\%|\;|\(|\)|\&|\+|\-]", "i");
// do field validation
if (form.name.value == "") {
alert( "<?php echo html_entity_decode(_REGWARN_NAME);?>" );
} else if (form.username.value == "") {
alert( "<?php echo html_entity_decode(_REGWARN_UNAME);?>" );
} else if (r.exec(form.username.value) || form.username.value.length < 3) {
alert( "<?php printf( html_entity_decode(_VALID_AZ09_USER), html_entity_decode(_PROMPT_UNAME), 2 );?>" );
} else if (form.email.value == "") {
alert( "<?php echo html_entity_decode(_REGWARN_MAIL);?>" );
} else if (form.password.value.length < 6) {
alert( "<?php echo html_entity_decode(_REGWARN_PASS);?>" );
} else if (form.password2.value == "") {
alert( "<?php echo html_entity_decode(_REGWARN_VPASS1);?>" );
} else if ((form.password.value != "") && (form.password.value != form.password2.value)){
alert( "<?php echo html_entity_decode(_REGWARN_VPASS2);?>" );
} else if (r.exec(form.password.value)) {
alert( "<?php printf( html_entity_decode(_VALID_AZ09), html_entity_decode(_REGISTER_PASS), 6 );?>" );
} else {
form.submit();
}
}
</script>
<form action="index.php" method="post" name="mosForm">
<div class="componentheading">
<?php echo _REGISTER_TITLE; ?>
</div>
<table cellpadding="0" cellspacing="0" border="0" width="100%" class="contentpane">
<tr>
<td colspan="2"><?php echo _REGISTER_REQUIRED; ?></td>
</tr>
<tr>
<td width="30%">
<?php echo _REGISTER_NAME; ?> *
</td>
<td>
<input type="text" name="name" size="40" value="" class="inputbox" maxlength="50" />
</td>
</tr>
<tr>
<td>
<?php echo _REGISTER_UNAME; ?> *
</td>
<td>
<input type="text" id="uname" name="username" size="40" value="" class="inputbox" maxlength="25" onfocus="clearcheck()" onblur="ajaxFunction()" />
<span id="unameHint"></span> </td>
</tr>
<tr>
<td>
<?php echo _REGISTER_EMAIL; ?> *
</td>
<td>
<input type="text" name="email" size="40" value="" class="inputbox" maxlength="100" />
</td>
</tr>
<tr>
<td>
<?php echo _REGISTER_PASS; ?> *
</td>
<td>
<input class="inputbox" type="password" name="password" size="40" value="" />
</td>
</tr>
<tr>
<td>
<?php echo _REGISTER_VPASS; ?> *
</td>
<td>
<input class="inputbox" type="password" name="password2" size="40" value="" />
</td>
</tr>
<tr>
<td colspan="2">
</td>
</tr>
<tr>
<td colspan=2>
</td>
</tr>
</table>
<input type="hidden" name="id" value="0" />
<input type="hidden" name="gid" value="0" />
<input type="hidden" name="useractivation" value="<?php echo $useractivation;?>" />
<input type="hidden" name="option" value="<?php echo $option; ?>" />
<input type="hidden" name="task" value="saveRegistration" />
<input type="button" value="<?php echo _BUTTON_SEND_REG; ?>" class="button" onclick="submitbutton_reg()" />
<input type="hidden" name="<?php echo $validate; ?>" value="1" />
</form>
<?php
}
}
?>
This is a very simple example. Base on this, we can develop more things with AJAX.
Thanks for your attention.
Show Posts
