Merge pull request #1042 from hotlcc/feature/develop-select-search-filter-group

新增select分组选择框在开启搜索时支持过滤未匹配到分组元素的分组
This commit is contained in:
贤心
2022-06-20 19:57:41 +08:00
committed by GitHub
2 changed files with 74 additions and 19 deletions

View File

@@ -126,25 +126,71 @@
</div>
<div class="layui-form-item">
<label class="layui-form-label">搜索选择框</label>
<div class="layui-input-inline">
<select name="interest-search" lay-filter="interest-search" lay-search>
<option value="">请搜索</option>
<option value="写作">写作</option>
<option value="阅读" disabled>阅读</option>
<option value="游戏" disabled>游戏</option>
<option value="音乐">音乐</option>
<option value="旅行">旅行</option>
<option value="读书">读书</option>
<option value="1">layer</option>
<option value="2" disabled>laydate</option>
<option value="3">3</option>
<option value="4">layim</option>
<option value="5">laypage</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
</select>
<div class="layui-inline">
<label class="layui-form-label">搜索选择框</label>
<div class="layui-input-block">
<select name="interest-search" lay-filter="interest-search" lay-search>
<option value="">请搜索</option>
<option value="写作">写作</option>
<option value="阅读" disabled>阅读</option>
<option value="游戏" disabled>游戏</option>
<option value="音乐">音乐</option>
<option value="旅行">旅行</option>
<option value="读书">读书</option>
<option value="1">layer</option>
<option value="2" disabled>laydate</option>
<option value="3">3</option>
<option value="4">layim</option>
<option value="5">laypage</option>
<option value="6">6</option>
<option value="7">7</option>
<option value="8">8</option>
</select>
</div>
</div>
<div class="layui-inline">
<label class="layui-form-label">搜索分组框</label>
<div class="layui-input-block">
<select name="interest-search-group" lay-filter="interest-search-group" lay-search>
<option value="">请搜索</option>
<optgroup label="分组a">
<option value="a1">a1</option>
<option value="a2">a2</option>
</optgroup>
<optgroup label="分组aa">
<option value="aa1">aa1</option>
<option value="aa2">aa2</option>
</optgroup>
<optgroup label="分组b">
<option value="b1">b1</option>
<option value="b2">b2</option>
</optgroup>
<optgroup label="分组bb">
<option value="bb1">bb1</option>
<option value="bb2">bb2</option>
</optgroup>
<optgroup label="分组bbb">
<option value="bbb1">bbb1</option>
<option value="bbb2">bbb2</option>
</optgroup>
<optgroup label="分组c">
<option value="c1">c1</option>
<option value="c2">c2</option>
</optgroup>
<optgroup label="分组cc">
<option value="cc1">cc1</option>
<option value="cc2">cc2</option>
</optgroup>
<optgroup label="分组ccc">
<option value="ccc1">ccc1</option>
<option value="ccc2">ccc2</option>
</optgroup>
<optgroup label="分组cccc">
<option value="cccc1">cccc1</option>
<option value="cccc2">cccc2</option>
</optgroup>
</select>
</div>
</div>
</div>