mvc4部分视图在同一视图上使用了两次

Question

我对级联下拉菜单（即国家和州）有部分看法。我正在使用以下剃刀视图语句来渲染此局部视图

@{Html.RenderAction("PopulateCountriesDropdown", "Helper");}

而且效果很好。以下是部分视图的完整代码，该视图异步调用控制器的操作方法]

<pre>@model OnlineExamSystem.Models.CountryAndStateViewModel
@Html.LabelFor(m => m.c.CountryName)
@Html.DropDownListFor(m => m.c.CountryId, new SelectList(Model.cntlist, "CountryId", "CountryName"),"--Select Country--", new {  @class="aha" })
@Html.Label("State")

注意：，因为我无法编写HTML，即我有一个简单的html select用于显示第二个下拉菜单，以显示带有class="ddlstates"的状态。

<script type="text/javascript">
$(document).ready(function () {
    $(".aha").change(function () {
        var Url = '/Helper/PopulateStateDropdown';
        var catId = $(this).val();
        //alert(catId);
        var select = $('.ddlstate');
        if (catId != '') {
            $.getJSON("/Helper/PopulateStateDropdown", { id: catId },
                function (ddl) {
                    select.empty();
                    select.append($("<option></option>", { value: 0, text: '--Select State--' }));
                    $.each(ddl, function (index, itemData) {
                        select.append($("<option></option>", { value: itemData.Value, text: itemData.Text }));
                    });
                });
        }
        else {
            select.empty();
            select.append($("<option></option>", { value: 0, text: '--Select State--' }));

        }
    });
});

正如我所说，这很好。但是这是问题所在，即当我尝试在同一页面（视图）上再次渲染相同的部分视图时，如下所示

@{Html.RenderAction("PopulateCountriesDropdown", "Helper");}
渲染正常，但是在第二个局部视图中更改国家/地区无法正确选择州。我也注意到下面的动作方法被第一个局部视图调用了两次

[AcceptVerbs(HttpVerbs.Get)]
public JsonResult PopulateStateDropdown(string id)
{
     var ls = State.GetStateByCountryId(Int32.Parse(id)).AsEnumerable();
     var ddl = ls.Select(m => new SelectListItem() { Text = m.StateName, Value = m.StateId.ToString() });
     return Json(ddl, JsonRequestBehavior.AllowGet);
}
有趣的是，上述方法根本没有从第二部分视图中调用。

我对级联下拉菜单（即国家和州）有部分看法。我正在使用以下剃刀视图语句来渲染此局部视图@ {Html.RenderAction（“ PopulateCountriesDropdown”，“ ...

Answer 1

(doucment).ready()第一次加载页面时将事件绑定到dome元素，它在DOM中查找元素并将事件绑定到它们，在您的情况下，作为局部视图，html在页面加载后动态呈现在页面上因此事件未绑定。