# Table 列表的搜索 ### `EpiiAdmin`在`bootstrap-table`的基础上增加了搜索表单功能，并且搜索表单与table完全隔离，这意味着你可以在页面的任何一个地方展示表单，只需绑定表单即可实现对表单的搜索。 - 支持多表单对一个列表的搜索 - 支持页面多个table，并分别设置搜索 ### 务必先仔细阅读 [`Form章节`](form.md); 在任何一个form表单上只需加上 - `data-form='1'` - `data-search-table-id='1'` 其中 `data-search-table-id` 来指定绑定的`table`。 如果值为`1` 则默认为第一个table。推荐使用table的具体id。 >[warning] 提醒：当绑定table后，在form中不要设置action属性。 >[info] 搜索变量的传递方式默认追加到post请求中。 例1， ```html <form role="form" class="form-inline" data-form="1" data-search-table-id="1"> <div class="form-group"> <label>名称：</label> <input type="text" class="form-control" name="name1" placeholder="请输入名称" required> </div> <div class="form-group"> <label>名称2：</label> <input type="text" class="form-control" name="name2" placeholder="请输入名称"> </div> <div class="form-group"> <label>名称3：</label> <input type="text" class="form-control" name="name3" placeholder="请输入名称"> </div> <div class="form-group"> <button type="submit" class="btn btn-primary">提交</button> <button type="reset" class="btn btn-default">重置</button> </div> </form> ``` 程序会自动在table增加表单的字段到post数据中。 操作视频 <p> <video controls="controls" width="100%" src="http://epii.gitee.io/static/project/epiiadmin-js/docimg/table20.mov"></video> </p> 支持[`Form章节`](form.md)的所有功能，以`data-before-submit="confirm"`为例： ```html <form role="form" class="form-inline" data-form="1" data-search-table-id="1" data-before-submit="confirm" data-msg="您确定要搜索吗？" data-title="自定义标题" data-btn-ok="继续搜索" data-btn-cancel="我不搜索" data-intop="1"> <div class="form-group"> <label>名称：</label> <input type="text" class="form-control" name="name1" placeholder="请输入名称" required> </div> <div class="form-group"> <label>名称2：</label> <input type="text" class="form-control" name="name2" placeholder="请输入名称"> </div> <div class="form-group"> <button type="submit" class="btn btn-primary">提交</button> <button type="reset" class="btn btn-default">重置</button> </div> </form> ``` 操作视频 <p> <video controls="controls" width="100%" src="http://epii.gitee.io/static/project/epiiadmin-js/docimg/table21.mov"></video> </p>