2

I have two drop-downs when we are selecting the first one we need to update the second one.
Below is my view:

@model HostingManager.Models.ContractManager
@{
    ViewBag.Title = "CustomCreate"; 
}
@Html.Partial("_GroupDDL" , Model)
@Html.Partial("SelectClient", Model)
@Html.Partial("SelectContract", Model)

Below is first Drop-down (Partial View: _GroupDDL)

@model HostingManager.Models.ContractManager

@using (Ajax.BeginForm("SelectClient", "Contracts", new AjaxOptions { UpdateTargetId = "IClients" }))
{ 
    @Html.DropDownListFor(
        m => m.SelectedGroupId,
        new SelectList(Model.IGroups, "id", "name"),
        string.Empty
    )
}
<script type="text/javascript">
    $('#SelectedGroupId').change(function () {
        $(this).parents('form').submit();
    });
</script>

Below is Second Drop-down (Partial View: SelectClient)

@model HostingManager.Models.ContractManager

@if (Model.IClients != null && Model.IClients.Count() > 0)
{
    using (Ajax.BeginForm("SelectContracts", "Contracts", new AjaxOptions { UpdateTargetId = "IContracts" }))
    { 
        @Html.HiddenFor(m => m.SelectedGroupId)
        @Html.DropDownListFor(
            m => m.SelectedClientId,
            new SelectList(Model.IClients, "id", "cname"),
            string.Empty
        )
    }
}

<script type="text/javascript">
    $('#SelectedClientId').change(function () {
        $(this).parents('form').submit();
    });
</script>

Below is my Controller action:

public ActionResult CustomCreate()
{
    ContractManager CM = new ContractManager();
    CM.IGroups = db.groups.ToList();
    return View(CM);
}

[HttpPost]
public ActionResult SelectClient(int? SelectedGroupId)
{
    ContractManager CM = new ContractManager();
    CM.IClients = new List();
    if (SelectedGroupId.HasValue)
    {
        CM.IClients = db.client.ToList();
    }
    return PartialView("SelectClient", CM);
}

Now The problem:

In Debugging Mode when I'm selecting the first DDL. Control is coming to second DDL with the values but the Second DDL is not appearing on the View. i.e. We can't see the Second DDL on the UI.

I have already added ajax script in my Layout and also enabled in web.config. I'll filter the Second DDL the once if I can overcome this.

4

1 回答 1

0

除了完美示例之外，您还可以使用jQuery.post在 _GroupDDL 部分视图中执行以下操作：

<script type="text/javascript">
    $('#SelectedGroupId').change(function () {
        $.post('@Url.Action("SelectClient", "Contracts")', {SelectedGroupId: $(this).val()}, function(data) {
           $('#SelectedClientId').html(data);
        });
    });
</script>

每次更改 SelectedGroupId ddl 时，它将调用 Controller 的 SelectClient 操作，它将返回 SelectedClientId 的 html，其中包含基于父/主 ddl 选择的所有选项。

于 2013-04-07T12:35:31.093 回答