如何從Cascading DropdownList獲取選定數據到Controller

Question

我沒有收到數據（零售商從1英尺DDL和SubRetailer從第二個DDL）通過提交表格從級聯DropDownList到Controller選擇。 它總是在控制器中為Null Value。

- 主要DDL列表ParentRetailer

@Html.DropDownListFor(m => m.Retailer, new SelectList(Model.lstParentRetailsDetails, "ParentRetailerID", "ParentRetailerName"), "All Selected",
new { id = "ParentRetailerDDL", @class = "form-control" })

- 輔助DDL清單SUbRetailer

<div class="form-group">
    <label>SubRetailer</label>
    @Html.DropDownListFor(m => m.SubRetailer, Model.SubRetailerList, "All Selected", new { @class = "form-control", id = "SubParentRetailerDDL" })       
</div>

Java腳本如下

$().ready(function (msg) {
        $("#ParentRetailerDDL").bind("change", function () {
            GetNames($(this).val());
        });
});

function GetNames(ParentRetailerID) {
    if (ParentRetailerID > 0) {
         $("#SubParentRetailerDDL").get(0).options.length = 0;
        $.ajax({
            type: "POST",
            url: "Search/getSubRetailer",
            data: "{ParentRetailerID:" + ParentRetailerID + "}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                 $("#SubParentRetailerDDL").get(0).options.length = 0;            
                $.each(msg, function (index, item) {
                    $("#SubParentRetailerDDL").append("<option value='" + item.SubRetailerID + "'>" + item.SubRetailerName + "</option>");
                });
            },
            error: function () {
                $("#SubParentRetailerDDL").get(0).options.length = 0;
                alert("Failed to load SubRetailer");
            }
        });
    }
    else {
        $("#SubParentRetailerDDL").get(0).options.length = 0;
    }
}

和搜索控制器

//[HttpPost]
public ActionResult Search(SearchViewModel searchViewModel)
{ 
    string ParentRetailer = searchViewModel.Retailer;
    String getSubRetailer = searchViewModel.SubRetailer;
}

模型 - -

public class SearchViewModel
{
    public string Retailer { get; set; }
    public List<DashboardGetRetailers_Result> lstParentRetailsDetails { get; set; } 

    public string SubRetailer { get; set; }
    public SelectList SubRetailerList { get; set; }
}

控制器從數據庫中獲取數據---

// GET: Search
public ActionResult Index()
{
    var searchViewModel = new SearchViewModel();
    searchViewModel.lstParentRetailsDetails = db.DashboardGetRetailers().ToList(); 
    return View(searchViewModel);
}


public ActionResult getSubRetailer(int ParentRetailerID)
{
    var data = db.DashboardGetSubRetailer(ParentRetailerID).ToList();
    return Json(data, JsonRequestBehavior.AllowGet);
}

- 查看提交按鈕..

<div class="form-group">
    <button class="btn btn-default pull-right" type="submit">
        <i class="fa fa-search"> Search</i>
    </button>
</div>

我需要從List到Controller獲取所選數據。 它始終為空。

Answer 1

感謝Stephen Muecke。 現在我成功地從級聯dropdownlost到控制器接收了數據。 最終的Java腳本和視圖代碼如下

觀點的變化

 <div class="form-group">
<label>Retailer</label>      
 @Html.DropDownListFor(m => m.Retailer, new SelectList(Model.lstParentRetailsDetails, "ParentRetailerID", "ParentRetailerName"), "All Selected", new { id = "ParentRetailerDDL", @class = "form-control" })                            
</div>


<div class="form-group">
<label>SubRetailer</label>
 @Html.DropDownListFor(m => m.SubRetailer, new SelectList(Enumerable.Empty<SelectListItem>(), "SubRetailerID", "SubRetailerName"), "All Selected", new { @class = "form-control", id = "SubParentRetailerDDL" })
</div>

- Java腳本內部

$().ready(function (msg) {
    $("#ParentRetailerDDL").bind("change", function () {
        GetNames($(this).val());
    });
});

function GetNames(ParentRetailerID) {
    if (ParentRetailerID > 0) {
        $("#SubParentRetailerDDL").empty();
        $.ajax({
            type: "POST",
            url: "Search/getSubRetailer",
            data: "{ParentRetailerID:" + ParentRetailerID + "}",
            contentType: "application/json; charset=utf-8",
            dataType: "json",
            success: function (msg) {
                $.each(msg, function (index, item) {
                    $("#SubParentRetailerDDL").append("<option value='" + item.SubRetailerID + "'>" + item.SubRetailerName + "</option>");
                });
            },
            error: function () {
                $("#SubParentRetailerDDL").get(0).options.length = 0;
                alert("Failed to load SubRetailer");
            }
        });
    }
    else {
        $("#SubParentRetailerDDL").get(0).options.length = 0;
    }
}

問候