Question

我正在使用Javascript将部分视图动态加载到DIV中：

    $.ajax({
        url: '@Url.Action("Details","User")',
        data: { id: userId},
        type: 'post',
        success: function (data) {
        $("#user-details").show().html(data);})

显示时，我想填充一些下拉菜单供用户进行选择。让我们说我想填充一个“UserCategories”列表

所以在上面的ajax调用成功之后我做了：

                $.getJSON('@Url.Action("GetUserCategories","User")',function(data) {
                $.each(data, function (key, item) {

                    $("#userCategories-list").append(
                        $("<option></option>").text(item.Name).val(item.Id)
                    );
                });
            });

未填充UserCategories列表。

我认为这是因为包含UserCategories下拉菜单的UserDetails源html是动态呈现的，而不是在页面上显示？

如何访问和填充我的“userCategories-list”下拉菜单，该菜单通过ajax调用显示，以及在查看页面源/ Firebug时我看不到的HTML /控件名称？

提前谢谢。

Answer 1

不能肯定地说，但我的猜测是，在调用列表创建函数时，部分视图不是浏览器DOM的一部分。实际上，我没有看到任何代码将您的部分加载到浏览器中进行渲染。

您是否尝试使用firebug或chrome debugger进行调试？您可以在函数中设置断点并查看实际发生的情况。

 $.ajax({
        url: '@Url.Action("Details","User")',
        data: { id: userId},
        type: 'post',
        success: function (data) { 
            $("#partialContainer").html(data);
            $.getJSON('@Url.Action("GetUserCategories","User")',function(listData) {
                $.each(listData, function (key, item) {
                    $("#userCategories-list").append(
                        $("<option></option>").text(item.Name).val(item.Id)
                    );
                }); //each
            )); //getJson
        } //success anon function
  }); //$.ajax

将数据加载到动态填充的部分视图中的“选择下拉菜单”

1 个答案: