选择带有搜索选项的框

Question

我有一个选择下拉列表。我需要在我的选项中进行搜索。我对它使用select2下拉列表，但选择不显示搜索，并且设计已完全更改。

这是我的代码：

exec sp_executesql N'SELECT K.Name, K.Info, K.Code, K.Barcode, P.Price, P.FinalPrice, M.Mojoodi, G1.GroupKala AS [GroupName], G2.GroupKala AS [GroupParent]
FROM dbo.Mojoodi_All(@P1,@P2,DEFAULT,DEFAULT,DEFAULT) M
INNER JOIN KalaList K ON M.ID_Kala=K.ID
INNER JOIN KalaPrice P ON K.ID=P.KalaID AND P.PriceID=1 AND P.[Type]=2
LEFT OUTER JOIN GroupKala G1 ON K.GroupID=G1.ID
LEFT OUTER JOIN GroupKala G2 ON G1.ParentID=G2.ID
',N'@P1 varchar(10),@P2 varchar(10)','1399/01/01','1399/12/29'

<link href="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.0.13/dist/js/select2.min.js"></script>

<select class="single" name="icons" onchange="TypeCheck(this);">
    <option value="0">Pick an icon ...</option>
    <option value="1">glass</option>
    <option value="2">door</option>
    <option value="3">Furniture</option>
</select>

Answer 1

您可以使用select2默认搜索选项，而不想实现自己的代码搜索块。

<select class="yourClassName" name="states[]" multiple="multiple">
  <option value="AL">Alabama</option>
    ...
  <option value="WY">Wyoming</option>
</select>

您可以使用select2默认的jquery代码

$(document).ready(function() {
    $('.yourClassName').select2();
});

您可以访问此链接以获取更多详细信息https://select2.org/getting-started/basic-usage