ThinkPHP对Ajax完全支持

ThinkPHP对Ajax完全支持

ThinkPHP完全支持Ajax，并且还内置了一个SmartAjax和ThinkAjax类库，你可以不通过任何其他Ajax类库包就可以在ThinkPHP中使用Ajax支持。

首先说一下ThinkPHP的JS类库以及如何在ThinkPHP中引入Js类库

JS类库

ThinkPHP框架自带了一个易于扩展的JS类库，并且通过标签库技术和JS方法轻松导入。

JS类库的引入给ThinkPHP的发展和企业级应用开启了新的一面，同时也给基于ThinkPHP的应用开发定义了一个相对简单的JS导入规范。这个规范类似于ThinkPHP基类库的命名空间导入方式，并且该规范同样可以适用于CSS文件的导入。下面先看个例子：

基于标签库技术的JS类库引入方法

<html:import type='js'file='Js.Base'/>
html:import file='Js.Util.Calendar'/>

<

使用html:import标签 可以引入所需要的JS文件，如果没有指定type，则默认为js，import的根目录可以设定，也可以通过basepath参数指定。以上的标签就表示导入 Js/Base.js、 Js/Util/Calendar.js、 ../public/Js/common.js。

这种方式的Js导入是显式的，除了以上标签库形式的导入，ThinkPHP还支持隐式的JS方法导入JS文件。

在Base.js文件中定义了_import方法，可以起到和html:import标签类似的功能，例如：
<SCRIPT LANGUAGE='JavaScript'>ImportBasePath
='http://localhost/public/';_import('Js.Form.CheckForm');//-->
</SCRIPT>
<!--

要使用_import方法在Js文件中隐式导入所需的JS类库，前提是必须加载Base.js文件和设定ImportBasePath 参数（即导入根目录），并且该方法只能导入JS文件。

除此之外，ThinkPHP提供的JS类库还提供了基于文件名方式导入JS和CSS的方法：ImportJS和ImportCss。

ThinkPHP框架目前的JS类库还比较有限，但是开发人员可以很方便的扩充自己的JS类库，并且随着ThinkPHP的不断完善，也一定会提供更加丰富的JS类库。

目前提供的类库有：
Base.js JS基础文件
String目录 字符串操作扩充类
Util目录 工具类库
Form目录 表单操作类库

SmartAjax和ThinkAjax

SmartAjax 是一个Ajax类库，纯JS解决方案，参考了CoreAjax的某些功能实现，支持HTML元素和事件绑定Ajax操作、表单提交，并可以定时执行，支持更新效果。 ThinkAjax和ThinkPHP结合，在返回数据格式上面专门针对ThinkPHP作了处理，其他用法和SmartAjax类似。

主要属性：

updateTip //更新提示信息，支持HTML method //提交方法POST 或者GET effect //更新效果，采用mootools类库，例如 {”font-size”:[0,25],”opacity”: [1,0.3]} 主要方法：

// 发送Ajax请求

send(提交URL,提交参数,结果显示DIV对象或者ID,更新显示效果,定时执行时间间隔)

// 发送表单Ajax操作

sendForm(表单对象或者ID,提交URL,结果显示DIV对象或者ID,更新显示效果)

// 绑定Ajax操作到HTML元素和事件

bind(源HTML元素或者ID,绑定事件,提交URL,提交参数,结果显示DIV对象或者ID,更新效果)

// 页面加载时候进行Ajax操作

load(提交URL,提交参数,结果显示DIV对象或者ID,更新效果)

// 定时执行Ajax操作

repeat(提交URL,提交参数,结果显示DIV对象或者ID,执行间隔,更新效果)

使用举例：
// 加载需要的类库
<script language='JavaScript'  src='/Js/prototype.js'></script><script
language='JavaScript' src='/Js/mootools.js'></script>

<script language='JavaScript' src='/Js/SmartAjax.js'></script> SmartAjax.updateTip = "更新中～";
SmartAjax.effect = {'font-size':[0,30],'opacity': [1,0.3]};
// 页面加载时执行通过Ajax操作在后台执行load.php
SmartAjax.load('http://localhost/load.php',"name=thinkphp","result");
// 绑定click操作到id为run的html元素，执行Ajax
SmartAjax.bind('run','click','http://localhost/hello.php',"name=thinkphp","result");
// 每隔1秒种执行time.php，输出
SmartAjax.repeat('http://localhost/time.php',"",$('timer'),1000);
// Ajax方式提交表单数据
SmartAjax.sendForm('login', APP+'/User/checkLogin/','result',doLogin);

Ajax文件上传

ThinkPHP框架内置了对Ajax文件上传(非真正Ajax）的实现。采用的是iframe的方式对文件上传进行支持。结合ThinkPHP的文件上传类，可以很方便地进行文件上传和批量上传。下面是一个典型的文件上传示例代码：
<form id="upload"METHOD=POST
action="__APP__/Attach/insert/"enctype="multipart/form-data"target="iframeUpload">INPUT
TYPE="hidden"name="_AJAX_SUBMIT_"value="1">iframe
name="iframeUpload"src=""width="350"height="35"frameborder=0
SCROLLING="no"style="display:none"></iframe>INPUT
TYPE="hidden"name="_uploadFileResult"value="result">INPUT
TYPE="hidden"name="_uploadFileType"value="jpg,gif,png">
INPUT TYPE="hidden"name="_uploadSaveRule"value="{$user.id}">INPUT
TYPE="hidden"name="_uploadFormId"value="upload">INPUT
TYPE="hidden"name="_uploadFileSize"value="20480">
INPUT TYPE="hidden"name="_uploadResponse"value="uploadComplete">INPUT
TYPE="file"name="file">INPUT
TYPE="submit"value="上传">
form>

上传完成后，ThinkPHP系统会在iframe里面返回js代码和数据，并根据自定义的方法更新页面的result标签。更多关于文件上传方面的掌握请看 文件上传类的使用教程

后端Ajax数据返回

SmartAjax是一个独立的前端JS类库，其运行并不需要后台支持。不过，在后台处理和数据返回方面，结合ThinkPHP框架提供的一些完善处理，能够使得后台的开发效率提高。首先，在页面使用Ajax方式提交的时候使用_AJAX_SUBMIT_隐藏变量或者ajax变量，后台能够自动识别该操作为Ajax操作，并作出相应的处理。例如，表单提交Ajax方式，在form中添加<INPUT TYPE="hidden"
name="_AJAX_SUBMIT_" value="1">

如果使用SmartAjax.send方法提交操作，直接在参数里面添加ajax变量
SmartAjax.send('url','ajax=1&name=thinkphp','result);

在后台Action类处理完毕后，简单使用：

ajaxReturn($data,$info,$status) 来返回数据到客户端，其中

$data 表示需要返回客户端的数据，可以是字符串、数组或者对象（经过JSON_ENCODE编码，可以被js直接使用）

$info 表示提示信息（例如操作成功、失败等）

$status 表示操作状态码（1表示成功 0 表示失败 可以由应用自己定义，客户端作相应处理就可以了）

通常的方式我们需要使用echo或者exit来输出数据，并且还需要设置utf8编码，最麻烦的是还要自己进行json编码，使用AjaxReturn方法，一切都内置处理了。并且，另外一个方便之处是，不仅仅可以返回数据，还可以返回操作状态（例如操作失败还是成功）以及相关提示信息。 ThinkPHP对于JSON的处理已经作了兼容处理，无论是PHP4还是PHP5都可以直接使用JSON_ENCODE方法来对PHP对象、数组或者字符串等类型直接编码成JSON数据返回给客户端由JS处理。

为了更好的获取ThinkPHP后台Action的ajaxReturn方法返回的信息，框架JS类库中增加了一个ThinkAjax类库为后台ajax信息返回提供完全支持。 ThinkAjax类的使用和SmartAjax基本类似，只是简化了操作，只需要在客户端定义接受数据的处理方法，其他的由ThinkAjax类库自动处理了，包括信息提示。一个ThinkAjax的使用例子：
ThinkAjax.sendForm('formId','__URL__/action/',complete);complete(data,status,info){//
获取返回数据，并进行处理 }