select-2 外掛使用（個人總結簡易使用）
首先看看index頁面，可通用
{extend name="layout" /} {block name="plugins-css"} <link href="__LIBS__/jquery-nestable/jquery.nestable.css" rel="stylesheet" type="text/css" /> <link href="__LIBS__/select2/select2.min.css" rel="stylesheet" type="text/css" /> {/block} {block name="content"} {notempty name="page_tips"} <div class="alert alert-{$tips_type} alert-dismissable"> <button type="button" class="close" data-dismiss="alert" aria-hidden="true">×</button> <p>{$page_tips}</p> </div> {/notempty} <div class="row"> <div class="col-md-12"> <div class="block"> {notempty name="tab_nav"} <ul class="nav nav-tabs"> {volist name="tab_nav['tab_list']" id="tab"} <li {eq name="tab_nav.curr_tab" value="$key"}class="active"{/eq}> <a href="{$tab.url}{$_pop ?= '?_pop=1'}">{$tab.title|htmlspecialchars}</a> </li> {/volist} <li class="pull-right"> <ul class="block-options push-10-t push-10-r"> <li> <button type="button" data-toggle="block-option" data-action="refresh_toggle" data-action-mode="demo"><i class="si si-refresh"></i></button> </li> <li> <button type="button" data-toggle="block-option" data-action="fullscreen_toggle"></button> </li> </ul> </li> </ul> {else/} {empty name="_pop"} <div class="block-header bg-gray-lighter"> <ul class="block-options"> <li> <button type="button" data-toggle="block-option" data-action="refresh_toggle" data-action-mode="demo"><i class="si si-refresh"></i></button> </li> <li> <button type="button" data-toggle="block-option" data-action="fullscreen_toggle"></button> </li> </ul> <h3 class="block-title">{$page_title|default=""|htmlspecialchars}</h3> </div> {/empty} {/notempty} <div class="block-content tab-content"> <div class="tab-pane active"> {// 頂部篩選及搜尋 } {$extra_html_toolbar_top|default=''} <div class="row data-table-toolbar"> <div class="col-sm-12"> {// 搜尋框 } {notempty name="search"} <div class="pull-right search-bar"> <input type="hidden" name="search_field" id="search-field" value="{php}echo input('param.search_field', '') == '' ? $search['field_all'] : input('param.search_field');{/php}"> <div class="input-group"> <div class="input-group-btn"> <button class="btn btn-default" id="search-btn" data-toggle="dropdown" type="button" aria-expanded="false"> 搜尋 <span class="caret"></span> </button> <ul class="dropdown-menu"> <li> <a tabindex="-1" href="javascript:void(0)" data-field="{$search.field_all}">搜尋</a> </li> {volist name="search.fields" id="field"} <li> <a tabindex="-1" href="javascript:void(0)" data-field="{$key}">{$field|htmlspecialchars}</a> </li> {/volist} </ul> </div> <input type="text" class="form-control" value="{:input('param.keyword', '')}" data-url="{$search.url}" id="search-input" name="keyword" placeholder="{$search.placeholder}"> </div> </div> {/notempty} {// 頂部按鈕 } <div class="toolbar-btn-action"> {if (!empty($top_buttons))} {volist name="top_buttons" id="button"} {$button} {/volist} {/if} {// 下拉選單} {notempty name="_select_list"} <div class="form-inline" style="display: inline-block;"> {volist name="_select_list" id="item"} <select class="form-control select-change select-search" id="select-{$item.name}"> {notempty name="item.title"} <option value="" data-url="{$item.default_url}">{$item.title|default=''}</option> {/notempty} {volist name="item['options']" id="option"} <option value="{$key}" {php}if($item['current'] != '' && $item['current'] == $key){echo 'selected';}{/php} {php}if(is_array($item['url'])):{/php} data-url='{$item['url'][$key]}' {php}endif;{/php} >{$option}</option> {/volist} </select> {/volist} </div> {/notempty} <div class="form-inline" style="display: inline-block;"> <select class="js-select2 form-control" id="mall_id" name="mall_id" data-allow-clear="true" data-placeholder="請選擇歸屬賣場" style="width: 248px;" > {if condition="input('get.mall_id')"} <option value="{:input('get.mall_id')}" selected>{:input('get.mall_name')}</option> {/if} </select> </div> {// 時間段搜尋} {notempty name="_filter_time"} <div class="form-inline time-filter"> <div class="time-filter"> <div class="input-daterange input-group" data-date-format="yyyy-mm-dd"> <input class="form-control" type="text" id="_filter_time_from" name="_filter_time_from" value="{$Request.get._filter_time_from ? $Request.get._filter_time_from : $_filter_time.date_start}" placeholder="{$_filter_time.tips_start}"> <span class="input-group-addon"><i class="fa fa-chevron-right"></i></span> <input class="form-control" type="text" id="_filter_time_to" name="_filter_time_to" value="{$Request.get._filter_time_to ? $Request.get._filter_time_to : $_filter_time.date_end}" placeholder="{$_filter_time.tips_end}"> </div> <input type="hidden" id="_filter_time" name="_filter_time" value="{$_filter_time.field}"> <button type="button" id="btn-filter-time" class="btn btn-default">確定</button> </div> </div> {/notempty} </div> </div> </div> {$extra_html_toolbar_bottom|default=''} <div class="table-responsive"> {$extra_html_table_top|default=''} <table class="table table-builder table-hover table-bordered table-striped js-table-checkable"> <thead> <tr> {if (!$hide_checkbox)} <th class="text-center"> <label class="css-input css-checkbox css-checkbox-primary remove-margin-t remove-margin-b"> <input type="checkbox" id="check-all"><span></span> </label> </th> {/if} {volist name="columns" id="column"} <th class="column-{$column['name']} {$column.class|default=''}"> <span class="pull-right"> {// 排序功能} {php}if (isset($order_columns[$column['name']])): {/php} {php} $_by = input('param._by') == 'asc' ? 'desc' : 'asc'; $_param = array_merge(input('get.'), ['_by' => $_by, '_order' => $order_columns[$column['name']]]); if ($_param) { $_get = []; foreach ($_param as $key => $value) { $_get[] = $key. '=' .$value; } $_get = '?'.implode('&', $_get); } {/php} <a href="{$Request.baseUrl}{$_get}" data-toggle="tooltip" data-original-title="排序"> {php} if (input('param._order') == $order_columns[$column['name']]) { echo input('param._by') == 'asc' ? '<i class="fa fa-caret-up"></i>' : '<i class="fa fa-caret-down"></i>'; } else { echo '<i class="fa fa-sort text-muted"></i>'; } {/php} </a> {php}endif;{/php} {// 篩選功能} {php}if (isset($filter_columns[$column['name']])): {/php} {php} if (!empty(request()->param('_field_display'))) { $_field_display = request()->param('_field_display'); } {/php} <a href="javascript:void(0);" class="field-filter" data-filter="{$filter_columns[$column['name']]['filter']}" data-list="{$filter_columns[$column['name']]['list']}" data-type="{$filter_columns[$column['name']]['type']}" data-options='{$filter_columns[$column["name"]]["options"]|default=""}' data-map='{$filter_columns[$column["name"]]["map"]|default=""}' data-field-display="{$column['name']}" data-field="{$filter_columns[$column['name']]['field']}" data-table="{$filter_columns[$column['name']]['table']}" data-toggle="tooltip" data-original-title="篩選"><i class="fa fa-filter {notin name='column.name' value='$_field_display'}text-muted{/notin}"></i></a> {php}endif;{/php} </span> {// 欄位標題} {$column.title|default=''|htmlspecialchars} </th> {/volist} </tr> </thead> <tbody> {volist name="row_list" id="row"} <tr class="{$row['_tr_class']|default=''}"> {if (!$hide_checkbox)} <td class="text-center"> <label class="css-input css-checkbox css-checkbox-primary"> <input class="ids" type="checkbox" name="ids[]" value="{$row['_primary_key_value']|default='123'}"><span></span> </label> </td> {/if} {volist name="columns" id="column"} <td class="{$column['class']|default=''}"> {$row[$column['name']]|default=''} </td> {/volist} </tr> {/volist} {empty name="row_list"} <tr class="table-empty"> {php}$colspan = count($columns)+1{/php} <td class="text-center empty-info" colspan="{$colspan}"> <i class="fa fa-database"></i> 暫無資料<br> </td> </tr> {/empty} </tbody> </table> {$extra_html_table_bottom|default=''} </div> <div class="data-table-toolbar"> <div class="row"> <div class="col-sm-12"> {// 分頁 } {notempty name="pages"} {$pages} {/notempty} {notempty name="_page_info"} <div class="pagination-info pull-right"> <div> <input type="text" class="form-control input-sm go-page" id="go-page" name="page" value="{:input('param.page', '1')}"> <input type="text" class="form-control input-sm nums" id="list-rows" name="list_rows" value="{php}echo input('param.list_rows', '') == '' ? config('list_rows') : input('param.list_rows');{/php}"> / <strong>{$_page_info->lastPage()}</strong> 頁，共 <strong>{$_page_info->total()}</strong> 條資料，每頁顯示數量 </div> </div> {/notempty} </div> </div> </div> </div> </div> </div> </div> </div> {/block} {block name="script"} <script src="__LIBS__/select2/select2.full.min.js"></script> <script> $(function () { //遠端篩選 $("#mall_id").select2({ ajax: { url: "{:url('admin/activityshop/inputcheck')}", dataType: 'json', delay: 250, data: function (params) { return { q: params.term, // search term pagesize: 10,//頁面大小 page: params.page//當前頁 }; }, processResults: function (data, params) { params.page = params.page || 1; return { results: data.list, pagination: { more: (params.page * 10) < data.total_count } }; }, cache: true }, escapeMarkup: function (markup) { return markup; }, // let our custom formatter work minimumInputLength: 0, }); $("#mall_id").on("select2:select",function(e){ window.location.href="{:url('admin/activityshop/index')}"+"?mall_id="+e.params.data.id+"&mall_name="+e.params.data.text; }) // 選中事件 }); </script> {/block}
根據index頁面，我們只需要關注一個地方
<script> $(function () { //遠端篩選 $("#mall_id").select2({ ajax: { url: "{:url('admin/activityshop/inputcheck')}", dataType: 'json', delay: 250, data: function (params) { return { q: params.term, // search term pagesize: 10,//頁面大小 page: params.page//當前頁 }; }, processResults: function (data, params) { params.page = params.page || 1; return { results: data.list, pagination: { more: (params.page * 10) < data.total_count } }; }, cache: true }, escapeMarkup: function (markup) { return markup; }, // let our custom formatter work minimumInputLength: 0, }); $("#mall_id").on("select2:select",function(e){ window.location.href="{:url('admin/activityshop/index')}"+"?mall_id="+e.params.data.id+"&mall_name="+e.params.data.text; }) // 選中事件 }); </script>
我們只需要更改上面程式碼的ajax的路徑為自己的就可以了，還有點選後的跳轉頁面的href的值
核心部分還是我們在後端的處理程式
後端的程式碼如下：
/** * 輸入值查詢的ajax * @return \think\response\Json */ public function inputCheck(){ if($this->request->isAjax()){ $check = trim( input('q','','htmlspecialchars') ); $list = Db::name('activity')->where('act_name','like','%'.$check.'%')->field('act_name,act_id')->paginate(10); $_list = array(); foreach( $list as $r ){ $row['id'] = $r['act_id']; $row['text'] = "[{$r['act_id']}]".$r['act_name']; $_list[] = $row; } $arr['total_count'] = $list->total(); $arr['list'] = $_list; return json($arr); }else{ $this->error('連線方式出錯!'); } }
裡面的查詢用自己的即可，頁面效果如下
如果需要預設值的話，就需要注意這個頁面的路徑url
這樣的話你只需要在需要預設值的頁面給他傳遞mall_name的這個引數即可
相關推薦
select-2 外掛使用（個人總結簡易使用）
首先看看index頁面，可通用 {extend name="layout" /} {block name="plugins-css"} <link href="__LIBS__/jquery-nestable/jquery.nestable.css" r
Git基礎命令使用（個人總結）
down class 一次 onf set .net remote odin -a 個人在開發中整理常用的git命令，相信很多人會需要到的。 全局配置信息： git config --global user.name "Your name"
scrapy詳細資料流走向（個人總結）
直接從資料流的角度來說比較容易理解： ·1、Spider建立一個初識url請求，把這個請求通過Engine轉給Scheduler排程模組。然後Scheduler向Engine提供一個請求（這個請求是一個真實的url請求） 疑問點一：為什麼Engine把請求發給Scheduler模組，然
scrapy詳細數據流走向（個人總結）
emp 這不 inf 處理 download 需要 pipe ddl gin 直接從數據流的角度來說比較容易理解： ·1、Spider創建一個初識url請求，把這個請求通過Engine轉給Scheduler調度模塊。然後Scheduler向Engine提供一個請求（這
java初級面試題（個人總結）
java基礎 1、String、StringBuffer以及StringBuild的區別？ 答：這三個類之間的區別主要是在兩個方面，即執行速度和執行緒安全這兩方面 執行速度：StringBuilder > StringBuffer > String
阿里架構設計之初體驗，送給準備進階架構的朋友（個人總結）
1 基本概念和目的 架構設計的目的是為了解決系統複雜度帶來的問題，並不是要面面俱到，不需要每個架構都具備高效能、高可用、高擴充套件等特點，而是要識別出實際業務實際情況的複雜點，然後有有針對性地解決問題，即：有的放矢，而不是貪大求全。 在實際情況中，不一定每個系統都要做架
一個Activity多個Handler時，Message是如何傳遞的（個人總結）
作者：海岸線-haianxian 來源：CSDN 原文：https://blog.csdn.net/u010680097/article/details/52142396 版權宣告：本文為博主原創文章，轉載請附上博文連結！ 上面是作者的原文
Doxygen使用教程（個人總結）
簡介Doxygen 一．什麼是Doxygen? Doxygen 是一個程式的檔案產生工具，可將程式中的特定批註轉換成為說明檔案。通常我們在寫程式時，或多或少都會寫上批註，但是對於其它人而言，要直接探索程式裡的批註，與打撈鐵達尼號同樣的辛苦。大部分有用的批註都是屬於針對函式
關於虛擬機器（VMware） 中橋接模式與nat模式的區別（個人總結）
一、橋接模式 1.本人通過網上的的查詢得到的答案是，橋接模式使用的是區域網模式，關聯的同時不會對主機網路產生很大的影響，但是我在配置的時候遇到的問題就是在不同的環境下，每次的ip地址都不一樣，導致每次都需要重新配置，橋接模式試用與在固定的網路下面使用，本人也通過配置靜態ip
Swift學習總結（個人總結，以方便理解為主）
swift總結 一、註冊cell 1.用nib, 向 tableview 註冊 cell 全域性變數 let cellIdentifier = "myCell" myTableView!.registerNib(UINib(nibName: "MyCell", bundle
iOS 崩潰日誌分析（個人總結，最實用）
要分析奔潰日誌需要三個檔案：crash日誌，symbolicatecrash分析工具，.dSYM符號集 0. 在桌面建立一個crash資料夾 1. 需要Xcode自帶的崩潰分析工具symbolicatecrash，這個檔案的位置參考：/Applications/Xcode.
軟體測試需要具備的知識體系（個人總結）
一、軟體的生命週期(SDLC，Systems Development Life Cycle,SDLC) 軟體計劃與可行性研究（問題定義、可行性研究）；需求分析；軟體設計（概要設計、詳細設計）；編碼；軟體測試；執行與維護 生存週期劃分 各階段的
sql語句合集大全（個人總結）
--查詢emp表 select * from emp; --查詢emp表的sal select a.SAL from emp a; --查詢emp表的ename select a.ename from
Delete出錯分析總結（個人總結很到位） 0x0000007ff64426f87e(ucrtbased.dll)處（處於dataa.exe中）引發的異常：
近日在除錯C++程式中new class 後delete 出現如下錯誤： * 0x0000007ff64426f87e(ucrtbased.dll)處（處於dataa.exe中）引發的異常：0xC0000005:讀取位置（0xffffffffffffff
關於activity工作流常用操作（個人總結）
1、部署流程定義 repositoryService.createDeployment().addClasspathResource(path+filename).deploy(); 2、刪除流程定義 ProcessDefinitionQuery quer
redis常用指令（個人總結）
Redis常用命令集 1）連線操作命令 quit：關閉連線（connection）auth：簡單密碼認證help cmd： 檢視cmd幫助，例如：help quit 2）持久化 save：將資料同步儲存到磁碟bgsave：將資料非同步儲存到磁碟lastsave：返回上次
HR開發（個人總結 有點亂哦）
業務需求： 完成一張員工績效考評的明細表，其樣子大致為： 成本中心 成本中心名稱 部門名稱 崗位描述 員工子組 員工編號 姓名 入職日期 異動本崗位日期 XXXX年XX月份 XXXX年XX月份 XXXX年XX月份 XXXX年XX月份 XXXX年XX月份 XXXX年XX月份
redis常用命令（個人總結）（docker中redis容器）
1.進入docker的redis docker exec -it [IP] redis-cli 2.執行操作之前要驗證密碼Authentication required auth 12345678 3.檢視 key、根據key搜尋可以用萬
Java 獲得網頁原始碼和模擬瀏覽器請求（個人總結）
Java獲取原始碼自己知道的幾種方式，在這裡總結一下。 1：GetSourceCode.java package kalision; import java.io.BufferedReader; import java.io.IOException; import
java事件監聽器使用小結（個人總結，有錯請指）
//第一種:外部定義，通過監聽器的物件來呼叫的監聽器 import java.awt.*; import java.awt.event.ActionEvent; import java.awt.event.ActionListener; import javax.