簡體   English   中英

如何根據先前的選擇過濾下拉列表

[英]How to filter drop down list based on previous selection

我有兩個表,即州和國家。這兩個是我的視圖頁面中的下拉列表。 我正在使用獨立查詢顯示每個下拉值。 在表狀態中我有stateid和countryid。 我需要根據國家/地區選擇過濾州的值。 我甚至有一個名為Table的主表,它由狀態和國家的ID組成。以下是我用來顯示的方式,

enter code here

//獲取狀態值

var query = (from i in dbContext.countries

                     join j in dbContext.States on i.Country_id equals j.Country_id

                     where j.State_id >= 0
                     select new
                     {
                         state = j.State_name}).ToArray//To get state values

在這里輸入代碼

  var str = (from li in dbContext.countries

                           where li.Country_id >= 1
                           select new
                           {

                               country = li.Country_name}).ToArray();//To get country

我怎么能查詢過濾主表“table”中的值。我在編寫查詢過濾時遇到問題這是否可以使用linq查詢? 請建議我如何做到這一點謝謝

這可以通過不同方式實現。 一種方法是讓服務器在第一個下拉列表更改時通過Ajax返回已過濾的有效選項列表。

例如,假設這種情況:帶有兩個DropDownLists的視圖; 一個與國家,另一個與國家。 具有狀態的DropDownList默認為空並在默認情況下禁用,直到選擇國家/地區為止。

所以你可以在你的控制器中使用這個Action:

public ActionResult Index()
{
    ViewBag.Country = new [] {
        new SelectListItem() { Text = "Venezuela", Value = "1" },
        new SelectListItem() { Text = "United States", Value = "2" }
    };
    return View();
}

而這個觀點:

<div class="editor-field">
    @Html.DropDownList("Country")
    @Html.DropDownList("State", Enumerable.Empty<SelectListItem>(), "States", new { @disabled = "disabled" })
</div>

現在在控制器中添加POST操作。 它接收所選國家/地區的ID並返回包含已過濾狀態列表的JSON:

[HttpPost]
public ActionResult StatesByCountry(int countryId)
{
    // Filter the states by country. For example:
    var states = (from s in dbContext.States
                  where s.CountryId == countryId
                  select new
                  {
                      id = s.Id,
                      state = s.Name
                  }).ToArray();

    return Json(states);
}

最后一件事是客戶端代碼。 此示例使用jQuery並在country下拉列表上設置更改事件偵聽器,該下拉列表通過Ajax調用新的控制器操作。 然后,它使用返回的值來更新“State”DropDownList。

$(document).ready(function () {
    $('#Country').change(function () {
        $.ajax({
            url: '/Home/StatesByCountry',
            type: 'POST',
            data: { countryId: $(this).val() },
            datatype: 'json',
            success: function (data) {
                var options = '';
                $.each(data, function () {
                    options += '<option value="' + this.id + '">' + this.state + '</option>';
                });
                $('#State').prop('disabled', false).html(options);
            }
        });
    });
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM