從另一個選定值填充一個下拉列表

Question

我有兩個下拉列表，我像這樣填充它們：

 private List<Client> Client()
        {
            var allClients= _db.tboClient.Select(x =>
            new Tecnico
            {
                Id = x.Id,
                Nome = x.Nome
            }).ToList();
            return allClients;
        }

        private List<Pricerice> Price()
        {
            var allPrice = _db.tboPrice.Select(x =>
            new Cliente
            {
                Id = x.Id,
                Nome_azienda = x.Nome_azienda
            }).ToList();
            return allPrice ;
        }

然后是一些我記得Client()和Price() 。 我像這樣加載視圖：

public IActionResult Create()
{
    ViewBag.Price= Pricei();
    ViewBag.Clienti = CLienti();
    return View();
}

這是 HTML：

 <div class="dropdown">
      @Html.DropDownListFor(m => m.CLienti, new SelectList(ViewBag.CLienti, "Id", "Nome_azienda"), new { @id = "ddlCLienti", @class = "btn btn-primary dropdown-toggle  mr-3" })
 </div>

 <div class="dropdown">
       @Html.DropDownListFor(m => m.Price, new SelectList(ViewBag.Price, "Id", "Nome"), new { @id = "ddlClienti", @class = "btn btn-primary dropdown-toggle  mr-3" })
</div>

我想根據從第一個下拉列表中選擇的值填充第二個（價格）下拉列表。

Answer 1

我想根據從第一個下拉列表中選擇的值填充第二個（價格）下拉列表。

為了實現實現級聯下拉列表的上述要求，您可以嘗試根據“ddlCLienti” dorpdown change事件上第一個下拉列表的先前選擇來填充第二個下拉列表，如下所示。

<script>
    $(function () {
        $("select#ddlCLienti").change(function () {
            var CLienti = $(this).val();

            $("select#ddlPrice").empty();

            $.getJSON(`/your_controller_name_here/GetPriceBySelectedCLienti?CLienti=${CLienti}`, function (data) {
                //console.log(data);
                $.each(data, function (i, item) {
                    $("select#ddlPrice").append(`<option value="${item.id}">${item.nome}</option>`);
                });
            });
        })
    })
</script>

GetPriceBySelectedCLienti操作方法

public List<Price> GetPriceBySelectedCLienti(int CLienti)
{
    //query data based on selected CLienti

    //...