jquery - 如何获取下拉菜单的Json对象？

Question

在尝试了更多关于级联下拉菜单之后，我决定通过 Jquery 来实现。

这是在我的城市 Controller

public ActionResult States(int id)  
     {
         AcademicERP.Models.AcademicERPDataContext dc = new AcademicERPDataContext();
         var states = from s in dc.States
                      where s.CountryID == id
                      select s;
         return Json(states.ToList());  
     }

我正在尝试调用它

city/create 包含脚本的页面

    var ddlCountry;
var ddlStateID;

function pageLoad() {
    ddlStateID = $get("StateID");
    ddlCountry = $get("CountryID");
    $addHandler(ddlCountry, "change", bindOptions);
    bindOptions();
}
 function bindOptions() {
    ddlStateID.options.length = 0;        
    var CountryID = ddlCountry.value;
    if (CountryID) {
// some logic to call $.getJSON()
        }

并且我的 View 中有 DD

<%= Html.DropDownList("CountryID") %>
<select name="StateID" id="StateID"></select>

那么 getJSON 参数是什么？我指的是blog 。但不工作。

Answer 1

像这样:

function bindOptions() 
{
    ddlStateID.options.length = 0;
    var CountryID = ddlCountry.value;
    if (CountryID) 
    {
        var url = "/<YOUR CONTROLLER NAME>/States/" + CountryID;
        $.get(url, function(data) {
            // do you code to bind the result back to your drop down
        });
    }
}

或者，我不使用 pageLoad，而是纯粹通过 jQuery 使用它:

$(document).ready(function() {
    $("#CountryID").change(function() {
        var strCountryIDs = "";
        $("#CountryID option:selected").each(function() {
            strCountryIDs += $(this)[0].value;
        });

        var url = "/<YOUR CONTROLLER NAME>/States/" + strCountryIDs;
        $.getJSON(url, null, function(data) {
            $("#StateID").empty();
            $.each(data, function(index, optionData) {
                $("#StateID").append("<option value='" 
                    + optionData.StateID 
                    + "'>" + optionData.StateName 
                    + "</option>");
            });
        });
    });
});

类似的事情...