美文网首页
下拉框搜索 select2 的使用[转载]

下拉框搜索 select2 的使用[转载]

作者: willeny | 来源:发表于2018-08-16 14:13 被阅读0次

原文地址:

https://m.imooc.com/article/14472

使用场景是:一个下拉框有太多值 需要搜索做匹配

  • 加载文件
<link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script>
  • html代码
<select name="hospital_id" id="searchHospital">
    <option value="0">请选择医院</option>
    <foreach name="hospitalData" item="list">
        <option value="{$list.hospital_id}" 
            <if condition="$_GET['hospital_id'] eq $list['hospital_id']">selected</if>>
        {$list.hospital_name}
        </option>
    </foreach>
</select>
  • js代码
<script>
    $(function(){
        $('#searchHospital').select2({
            placeholder: "Select a state"
        });
    });
</script>

相关文章

网友评论

      本文标题:下拉框搜索 select2 的使用[转载]

      本文链接:https://www.haomeiwen.com/subject/asznbftx.html