2014-12-19 37 views
-2

我使用Visual Studio中的ASPNET MVC 5 2014.1 我有一個裝滿數據從數據庫的組合框:如何填寫與asp.net的MVC阿賈克斯第二組合框

ViewBag.Brans = new SelectList(db.Brans.OrderBy(m => m.Ad), "No", "Ad"); 
@Html.DropDownList("Brans", null, htmlAttributes: new { @class = "form-control" }) 

然後我還有一個下拉框。我想從第一個組合框中選擇一個選項後填充該組合框。它就像從第一個組合中選擇國家一樣。那麼城市將出現在第二個。

你們有沒有人知道如何做到這一點?

+1

[mvc cascading dropdownlist](https://www.google.com.au/search?q=mvc+cascading+combobox&oq=mvc+cascading+comb&aqs=chrome.1.69i57j0l5.6604j1j7&sourceid=chrome&espv=2&es_sm=122&ie= UTF-8#q = mvc + cascading + dropdownlist) – 2014-12-19 11:16:56

+1

http://stackoverflow.com/questions/25008617/cascading-dropdownlist-with-mvc5-ajax-c-sharp-and-mssql-server/25009549#25009549 – SBirthare 2014-12-19 11:18:09

+1

who把這個-1 – 2016-02-13 07:26:57

回答

1

選項之一是使Ajax請求的動作將返回列表項

public virtual JsonResult GetCountryStates() 
     { 
      return Json(
       new 
       { 
        new List<SelectListItem>() {YOUR ITEMS HERE} 
       }); 
     } 

然後在你的Ajax回調的身體把代碼一樣,

function (data) { 
       //var selValue; 

       data = $.map(data, function (item, a) { 
        if (item.Selected) { 
         selValue = item.Value; 
        } 
        return "<option value=\"" + item.Value + "\" " + (item.Selected ? "selected" : "") + ">" + item.Text + "</option>"; 
       }); 
       $('statesSelect').html(data.join("")); 
       $('statesSelect').val(selValue); 
      }, 
+1

非常感謝。這是行之有效的 – 2016-02-13 07:27:20

0

@fly_ua:好根據下拉菜單填充方式 但是如果我們發佈表單並根據選定的值,我們從控制器獲取下一個下拉數據並再次重新載入表單?這可能是安全的方式,而不是做AJAX調用。

+0

嗨Kishan,可能是的,但在我的情況下,你已經在成員部分進行了身份驗證,MVC中的所有Actions包含[Authoroze]和角色檢查。所以就像我寫的 - 這只是其中一種可能的方式。 – 2014-12-19 13:12:59

0
$('#@Html.Encode(Html.IdFor(x => x.YourProperty))')on("Change", function (event) { 
    event.preventDefault(); 
    var id = $(this).val(); 

    $.ajax({ 
     url: '@Url.Action("ActionName", "ControllerName")', 
     type: "GET", 
     data: { 
      id: id, 
     }, 
     success: function (result) { 
      $('#@Html.Encode(Html.IdFor(x => x.SecondDropDownProperty))').html(result) 
     } 
    }); 
}); 

創建一個視圖,下拉和rendor剃刀JSON這一觀點

這樣做,你將創建通用的依賴下拉列表。