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){
  // 擷取返回資料，並進行處理 }