全選異步，一般都是用于列表的批量操作，如批量刪除，批量置頂，批量審核等。那如何使用呢？
#### 引入ajax模塊
如果你自定義一個新的js頁面需要使用ajax模塊，則需要先引入，如果用模板原有的，此步可跳過
~~~javascript
layui.define(['jquery', 'layer', 'ajax'], function(exports) {
jqMain = function() {};
var main = new jqMain();
main.init();
exports('main', {});
});
~~~
#### 配置模板，這個文件一般在tpl目錄，下面代碼是tpl/article.html的
~~~html
<table id="example" class="layui-table lay-even">
<thead>
<tr>
<th width="30"><input type="checkbox" id="checkall" data-name="checkbox" lay-filter="check" lay-skin="primary"></th>
<th width="60">序號</th>
<th>標題</th>
<th>連接</th>
<th width="70">排序</th>
<th width="80">審核</th>
<th width="152">操作</th>
</tr>
</thead>
<tbody>
{{# layui.each(d.list, function(index, item){ }}
<tr>
<td><input type="checkbox" name="checkbox" value="{{ item.id}}" lay-skin="primary"></td>
<td>{{ item.id}}</td>
<td>{{ item.title}}</td>
<td>{{ item.url}}</td>
<td><input type="text" class="layui-input ajax-blur" name="order" value="{{ item.id}}" data-params='{"url":"/php/test.php","data":"id=1&name=paco","loading":"false"}'> </td>
<td><input type="checkbox" name="switch" lay-skin="switch" lay-text="已審|未審" {{#if (item.switch){ }}checked="checked" {{# } }} lay-filter="ajax" data-params='{"url":"/php/test.php","confirm":"true","data":"id={{ item.id}}&name=paco","complete":"test"}'> </td>
<td>
<button class="layui-btn layui-btn-mini modal-iframe" data-params='{"content": "article-add.html", "title": "{{item.title}}","full":"true"}'>
<i class="iconfont"></i>編輯
</button>
<button class="layui-btn layui-btn-mini layui-btn-danger ajax" data-params='{"url": "/php/test.php","confirm":"true","data":"id=1&name=ni"}'>
<i class="iconfont"></i>刪除
</button></td>
</td>
</tr>
{{# }); }}
</tbody>
</table>
~~~
這里需要注意兩個地方:
#### 1、全選按鈕加上全選事件
~~~html
<input type="checkbox" id="checkall" data-name="checkbox" lay-filter="check" lay-skin="primary">
~~~
**lay-filter：**必須是check，不要問為什么是check，因為模板里封裝就是用這個名稱
**data-name：**這里的值必須是列表中每一個復選框的name值，如這里填的是checkbox，那么列表復選框的代碼是
~~~html
<input type="checkbox" name="checkbox" value="{{ item.id}}" lay-skin="primary">
~~~
全選事件是根據data-name這個值來查找列表中的復選框來實現選中的
#### 2、給刪除按鈕添加異步刪除事件
這里按鈕需要三個參數：ajax-all,data-name,data-params
~~~html
<button class="layui-btn layui-btn-small layui-btn-danger ajax-all" data-name="checkbox" data-params='{"url": "/php/test.php","data":"id=1&name=ni&va=23","confirm":"true"}'>
<i class="iconfont"></i> 刪除
</button>
~~~
**ajax-all：**此樣式是給按鈕綁定全選的單擊事件
**data-name：**列表復選框的name值，道理與上面全選的一樣，根據這個name值找出當前列表選中的復選框
**data-params：**這里有默認的參數，也可以添加自己的參數，用于后臺獲取，默認參數如表：
| 參數 | 默認值 | 說明 |
| -------- | ----- | ---------------------------------------- |
| method | get | 提交的方法 |
| data | | 提交到服務端的數據，格式為id=1&name=jqcool |
| dataType | json | 服務器返回數據類型 |
| complete | | 服務器返回數據后調用的自定義方法（注意影響的域，建議全局）name=jqcool&complete=test |
| url | | 請求的服務端地址 |
| loading | true | 是否啟用loading圖片 |
| confirm | false | 是否彈出窗口確認操作（注：switch、select和text不適用） |
| title | |當confirm為true時，彈出窗口的標題 |
| close | false | 是否關閉回調函數|
比如說我要用post請求，傳遞參數id=1,name=jqcool，服務端地址為:delall.php，不使用loading動畫，彈出確認窗口，代碼如下：
~~~html
data-params='{"url": "delall.php","data":"id=1&name=jqcool","confirm":"true","loading":"false"}'
~~~
這里要注意參數的單引號與雙引號，不能返了，要不會報錯。
提交到服務端處理完成后，服務端需返回以下json數據格式
~~~php
$data['status'] = 200;
$data['msg'] ="更新成功";
$data['url'] = "";
echo header("content-type:text/html; charset=utf-8");
echo json_encode($data);
~~~
| 參數 | 必填 | 說明 |
| ------ | ---- | ----------------------------------- |
| msg | 否 | 返回的提示信息 |
| url | 否 | 1、空或不定義時不操作 2、地址時跳轉到該地址 3、reload時刷新頁面 |
| status | 是 | 狀態，成功時為200，其它均為錯誤 |
上面返回代碼是彈出提示更新成功，頁面不做任何操作。
如果想刷新頁面呢，把url設成reload即可，代碼如下
~~~php
$data['status'] = 200;
$data['msg'] ="更新成功";
$data['url'] = "reload";
echo header("content-type:text/html; charset=utf-8");
echo json_encode($data);
~~~
###### 跳轉到地址
~~~php
$data['status'] = 200;
$data['msg'] ="更新成功";
$data['url'] = "jqadmin.jqcool.net";
echo header("content-type:text/html; charset=utf-8");
echo json_encode($data);
~~~
##### 自定義返回方法
如果上面三種情況都不通滿足需求，那腫么辦呢？定義complete方法，
1、首先在data-params的參數里添加complete參數，如我需要返回時調用test()方法，那代碼如下
~~~html
data-params='{"url": "delall.php","data":"id=1&name=jqcool","confirm":"true","loading":"false","complete":"test"}'
~~~
2、在當前模塊定義一個ajax模塊的方法便可調用了，代碼如下
~~~javascript
var ajax = layui.ajax;
ajax.test = function(ret, options, that) {
alert("這是ajax回調方法");
}
~~~
注意這里的test方法名可自定義，但不要覆蓋了模塊的內容方法。
**ret:**后端返回的json數據
**options:**請求的配置參數
** that：**當前操作的元素對象
