根据显示的数据 Table 值禁用下拉列表项

Disable drop down list items based on showed Data Table values

我有一个页面,其中有 2 个项目 -

项目 - 1。Jquery 显示 2 列系统名称、系统描述的数据表。

item - 2. 一个有一个下拉菜单和一个文本框的小表单。下拉列表包含系统名称,用户在文本框中输入一些描述并将值插入 DB 。插入值后出现在 Jquery 数据表中。

作为 Jquery 数据表中的示例,当前显示了 3 个值。 系统 1、系统 2 和系统 3。

在 DropdownList 中有 7 个项目... System1, System2 ..... ,System7.

我想达到的目标

我想根据显示的数据表禁用下拉列表中的项目。 所以考虑前面的例子 -

应在 DropDownList 中禁用项目 "System1, System2 & System3"。

我试过的 :

我也尝试使用 HTMLHelper 扩展。但是没有用。

这是填充数据表和 DDL 的方式::

下拉列表 :

控制器代码:

var flist = dbCtx.UserSystems.Where(l => l.InUse.Equals(false));
SelectList list = new SelectList(flist.ToList(), "SystemID", "SystemName");
ViewBag.sysnames = list;

剃须刀代码:

@Html.DropDownListFor(model => Model.SystemID, ViewBag.sysnames as SelectList, "Select SystemID", new { @class = "form-control" })

数据表:

控制器代码:

SysViewModel.SysDetails = dbCtx.Get_UserSystem(Userid).ToList<Get_Get_UserSystem_Result>();

剃须刀代码:

<table class="table table-striped table-bordered" id="">
    <thead class="navbar-dark navbar-dark bg-blue-grey white">
        <tr>
            <th>
                System Name
            </th>
            <th>
                Description
            </th>
        </tr>
    </thead>
    <tbody>
        @foreach (var item in Model.SysDetails)
        {
            <tr>
                <td>
                    @Html.DisplayFor(modelItem => item.SystemName)
                </td>
                <td>
                    @Html.DisplayFor(modelItem => item.Desc)
                </td>
            </tr>
            }
    </tbody>
</table>

您可以通过以下方式关闭下拉选项

<select>
    @{
        foreach (var item in List)
        {
            if(condition)//check exist or not
            {
            <option style="color:gray" disabled>
                @item.Name
            </option>
            }
            else
            {
            <option>
                @item.Name
            </option>
            }    
        }
    }
</select>