|
|
<三>包含的内容：
* 如何处理表单数据?
* 如何给xajax增加定制功能?
* 如何创建Loading...信息?
* 如何改变xajax的编码设置?
* 我能在私有或者收费产品之中使用xajax吗?
最早发布在我的个人Blog，文章地址：http://www.flyinghail.net/?p=44
原文：http://xajax.sourceforge.net/
英文原版：Copyright © 2005 J. Max Wilson
简体中文翻译：HonestQiao(乔楚)/2005-12-7 17:23/(第一版)
修改&补充：FlyingHail/2006.08.01 16:43/参考：http://wiki.xajaxproject.org/
如何处理表单数据?
xajax使得异步处理表单数据非常非常的简单. xajax.getFormValues()方法会自动的从表单提取数据，并作为一个参数提交给xajax注册的PHP函数.
xajax.getFormValues() 仅仅需要一个参数, 可以是你需要处理得表单的id, 或者是一个实际的表单对象. 你也可以使用xajax.getFormValues作为一个参数给xajax 函数, 例如:
PHP:
xajax_processFormData(xajax.getFormValues('formId'));
xajax 会生成一个与表单数据对应的请求字符串给xajax服务器解析，然后以一个与表单数据对应的数组传递给PHP函数，就想你提交表单使用PHP的$_GET数组那么简单.
xajax可以处理类似普通多维数组或者联合数组(哈希数组)等形式的复杂输入名字. 例如, 如果一个表单有三个多选框(checkboxes)并且都命名为 "checkbox[]", 但是值分别为 "check1", "check2", 和 "check3", 然后使用 xajax.getFormValues 函数作为参数传递给xajax 函数, 则 PHP 函数会接受到一个如下的数组:
PHP:
array (
'checkbox' =>
array (
0 => 'check1',
1 => 'check2',
2 => 'check3',
),
)
作为函数参数的数组的结构与传统意义上提交表单之后的$_GET数组的结构相同. 你可以访问数组之中的checkbox 的数据: $aFormData['checkbox'][0]
如何给xajax增加定制功能?
xajax可以使用各种附加的用户定制功能进行扩展. 正因为xajax是完全面向对象的，并且可以使用xajaxResponse的addScript()方法，所以他具有无限扩展的可能. 你可以创建你自己的xajax响应类，来继承xajaxResponse 类以及它的方法，并加上你自己定制的响应. 让我们用一个定制的增加选择组合框(select combo boxes)选项的响应指令的例子来说明. 你可以象下面这样扩展xajaxResponse 类:
PHP:
class myxajaxResponse extends xajaxResponse
{
function addAddOption($sSelectId, $sOptionText, $sOptionValue)
{
$sScript = "var objOption = new Option('".$sOptionText."','".$sOptionValue."');";
$sScript .= "document.getElementById('".$sSelectId."').options.add(objOption);";
$this->addScript($sScript);
}
}
现在, 取代xajaxResponse 对象的初始化, 把你自己的 myxajaxResponse 对象的初始化定义到你的 xajax PHP 函数之中:
PHP:
$objResponse = new myxajaxResponse();
$objResponse->addAssign("div1", "innerHTML", "Some Text");
$objResponse->addAddOption("select1","New Option","13");
return $objResponse;
被调用时，这个方法将会发送需要的javascript到页面并执行. 当然你也有另外一种做法Alternatively, 你可以在你的程序之中创建一个如下的javascript函数:
JavaScript:
<script type="text/javascript">
function addOption(selectId,txt,val)
{
var objOption = new Option(txt,val);
document.getElementById(selectId).options.add(objOption);
}
</script>
并且使用addScript() 调用这个方法:
PHP:
$objResponse->addScript("addOption('select1','New Option','13');");
如何创建Loading...信息？
xajax提供了一个简单但是重要的功能，那就是在xajax进行服务器调用时模拟反馈用的“Loading...”信息。xajax已经定义了两个 Javascript函数：xajax.loadingFunction()和xajax.doneLoadingFunction()，你可以用你自己定义的Javascript函数来重新定义它们以满足项目的需要，例如：
JavaScript:
xajax.loadingFunction = myCustomLoadingFunction;
或者
JavaScript:
xajax.loadingFunction = function(){xajax.$('loadingBar').style.display='block';};
loadingFunction()是ajax执行前执行的Javascript函数，doneLoadingFunction为ajax执行完毕后执行的Javascript函数
下面是一个完整的Loading...信息例子：
PHP:
<?php
require("xajax.inc.php");
function slow_function()
{
$objResponse = new xajaxResponse();
sleep(2); //we'll do nothing for two seconds
$objResponse->addAlert("All done");
return $objResponse;
}
$xajax = new xajax();
$xajax->registerFunction('slow_function');
$xajax->processRequests();
?><html>
<head>
<title>Loading Bar Demo</title>
<? $xajax->printJavascript(); ?>
</head>
<body>
<script type="text/javascript">
<!--
xajax.loadingFunction =
function(){xajax.$('loadingMessage').style.display='block';};
function hideLoadingMessage()
{
xajax.$('loadingMessage').style.display = 'none';
}
xajax.doneLoadingFunction = hideLoadingMessage;
// --></script>
<input type="button" onclick="xajax_slow_function();" value="Slow Function" />
<div id="loadingMessage" style="font-size: 22px; display: none;">
Loading...
</div>
</body>
</html>
如何改变xajax的编码设置？
xajax默认是UTF-8编码的，如果打算在其他编码的页面中使用xajax，可以参考下面的操作：
1、重新定义XAJAX_DEFAULT_CHAR_ENCODING
PHP:
//define ('XAJAX_DEFAULT_CHAR_ENCODING', 'utf-8' );
define ('XAJAX_DEFAULT_CHAR_ENCODING', 'ISO-8859-1' );
2、在构造函数中定义编码
PHP:
$xajax = new xajax("","xajax_",'ISO-8859-1');
$objResponse = new xajaxResponse('ISO-8859-1');
3、初始化后设置编码
PHP:
$xajax = new xajax();
$xajax->setCharEncoding('ISO-8859-1');
$objResponse = new xajaxResponse();
$objResponse->setCharEncoding('ISO-8859-1');
以上三个方法使用其中一种，或者搭配使用2和3。
如果你总是获得invalid XML的错误信息，而且你仅仅想要显示字符，不是进行比较和处理（必须安装了PHP的mbstring扩展）。你可以尝试使用xajax->outputEntitiesOn()开启转化特殊的字符的功能。
即使你按照上面的说明设置了返回的编码，但是XmlHttpRequest类提交的数据依然是UTF-8编码的。xajax为我们提供了decodeUTF8InputOn()方法来开启UTF-8编码转换。方法如下：
PHP:
$xajax = new xajax();
$xajax->setCharEncoding('ISO-8859-1');
$xajax->decodeUTF8InputOn();
提示：
* 尽可能的使用UTF-8编码
* 如果你在xajax构造函数或者使用$xajax->setCharEncoding()方法定义了编码类型，不要忘记在 xajaxResponse构造时进行同样的操作。如果你在xajax和xajaxResponse中使用不同的编码设置，在IE下将会产生XML错误。
* 不管你设置为使用什么编码，从Javascript传递过来的数据都是UTF-8编码的。使用$xajax->decodeUTF8InputOn()方法打开编码转换功能，可以将UTF-8自动转换成你设置的编码。
下面是一个完整的编码设置例子：
PHP:
<?php
require ('xajax.inc.php');
function testEncoding($strText)
{
$objResponse = new xajaxResponse('ISO-8859-1');
$objResponse->addAssign("div1","innerHTML",$strText);
return $objResponse;
}
$xajax = new xajax();
$xajax->setCharEncoding('ISO-8859-1');
$xajax->decodeUTF8InputOn();
$xajax->registerFunction("testEncoding");
$xajax->processRequests();
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<?php
$xajax->printJavascript();
?>
</head>
<body>
<div id="div1"></div>
<form id="form1" onsubmit="return false;">
<input type="text" value="Español" id="text1" name="text1" />
<input type="submit" value="Submit" onclick="xajax_testEncoding(xajax.$('text1').value);" />
</form>
</body>
</html>
我能在私有或者收费产品之中使用xajax吗?
简而言之: 能，只要你愿意。
xajax PHP 类库的发布遵循 GNU Lesser General Public License (LGPL).
2006.08.01 FlyingHail 修改&补充
简体中文手册版权所有 © 2005 HonestQiao(乔楚)
Copyright © 2005 J. Max Wilson
<完> |
|
IP卡
狗仔卡
发表于 2007-9-14 22:34:34
QQ好友和群
QQ空间
腾讯微博
腾讯朋友
收藏
转播
分享
淘帖
提升卡
置顶卡
沉默卡
喧嚣卡
变色卡
显身卡
