Select2 - select 2 的多個輸入在選擇其中一個時共享相同的選項 - BUGG

Question

我在 Select2 庫中遇到了一個奇怪的問題。 我添加了一些 select html 元素，每個標簽指定了不同的選項。 每個 select 裝飾有：

<select id="selectClient">
                    <option selected disabled="true">Client</option>
                        @foreach (var client in Model.Clients)
                        {
                            <option>@Html.DisplayFor(modelItem => client.ClientDisplayName)</option>
                        }
                </select>
<select name="SelectedProduct" id="selectProduct">
                    <option selected disabled="true">Produkt</option>
                        @foreach (var product in Model.Products)
                        {
                            <option>@Html.DisplayFor(modelItem => product.ProductDisplayName)</option>
                        }
                </select>

jQuery('#selectClient').select2({
        placeholder: 'Client',
        allowClear: true
        });
jQuery('#selectProduct').select2({
        placeholder: 'Client',
        allowClear: true
        });

當我從下拉列表中選擇 select 時，一切都像魅力一樣。 當第一個 select 中的選項被選中並且我移動到第二個 select 時，第二個選擇的下拉列表包含第一個 select 列表中的選項。 這些選項在 html 文件中是分開的。 我是否遺漏了 jQuery 聲明中的內容？

Answer 1

您可以分享您生成的 HTML 代碼嗎？ 因為我無法從您的 razor 代碼中分析

檢查這個例子它工作正常

Js 小提琴示例

<html>
<head>
<script
  src="https://code.jquery.com/jquery-3.6.0.min.js"
  integrity="sha256-/xUj+3OJU5yExlq6GSYGSHk7tPXikynS7ogEvDej/m4="
  crossorigin="anonymous"></script>
<link href="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/css/select2.min.css" rel="stylesheet" />
<script src="https://cdn.jsdelivr.net/npm/select2@4.1.0-rc.0/dist/js/select2.min.js"></script>

</head>
<body>
<select id="selectClient" style="width:200px">
                    <option selected disabled="true">Client</option>
                        <option value="1">Option 1</option>
                    <option value="2">Option 2</option>
                    <option value="3">Option 3</option>
                </select>
<select name="SelectedProduct" style="width:200px" id="selectProduct">
                    <option selected disabled="true">Produkt</option>
                    <option value="1">Option 4</option>
                    <option value="2">Option 5</option>
                    <option value="3">Option 6</option>
                </select>
</body>
</html>

文件

$('#selectClient').select2({
            placeholder: 'Client',
            allowClear: true
            });
    $('#selectProduct').select2({
            placeholder: 'Client',
            allowClear: true
            });

Select2 - select 2 的多個輸入在選擇其中一個時共享相同的選項 - BUGG

問題描述

1 個解決方案

解決方案1
0 2022-02-25 09:23:01

Select2 - select 2 的多個輸入在選擇其中一個時共享相同的選項 - BUGG

問題描述

1 個解決方案

解決方案1 0 2022-02-25 09:23:01

解決方案1
0 2022-02-25 09:23:01