组合框/下拉框在其数据更新后未更新

时间:2012-05-31 19:35:48

标签: c# javascript jquery ajax model-view-controller

一个很长的解释,但我相信这是一个非常简单的问题。我想我在这里错过了一些东西。

从下拉菜单中选择用户角色后,我正在将带有该角色的用户的部分视图加载到带有ajax的DIV中:

        $.ajax({
        type: 'post',
        data: { id: roleId},
        url: '@Url.Action("Manage","User")',
        success: function (data) {
            $("#user-manage").html(data);
        }
    });

现在,在页面上,我有一个带有用户列表和删除按钮的组合框。 我突出显示用户,按“删除”按钮,用户将被删除。

大!它工作,但我的问题是删除的用户不会从组合框列表中消失,直到刷新页面。我无法刷新页面,因为这意味着网站用户必须重新开始选择角色。

所以,问题是如果我点击删除按钮后如何让用户在组合框中消失?

现在,当按下删除按钮时,所选的UserId将传递以下ajax调用,该调用将删除所选用户并返回更新的JSON用户列表:

    function removeUser() {
    var selectedUser = $("#user-combo").find(":selected").val(); //grab selected user
    var selectedForRole = $("#role-id").val(); //hidden field to store selected role

    $.ajax({
        url:"/User/Delete", //Delete selected user and return updated Json list
        data: { id: selectedUser , roleId: selectedForRole },
        type: 'post',
        success: function (data) {
            var userList = $("#user-combo");
            var listContent;

            $.each(data, function (index, item) {
                listContent += "<option value='" + item.Id + "'>" + item.Name + "</option>";
            });

            userList.html(listContent);
        }
    });
}    

在功能上这是有效的。用户被删除但我没有看到它反映在$(“#user-combo”)框中,直到我刷新屏幕。

location.reload();对我不起作用,因为我不希望网站用户选择角色来查看更新的用户列表。

如何删除这些内容并使用户在删除时消失,并在以后添加时显示?

提前谢谢。

编辑。 Json对象返回组合框:

return Json(roleUsers.Select(x => new
            {
                Id = x.Id,
                Name = x.Name
            }));

2 个答案:

答案 0 :(得分:0)

就这么简单:

$("#comboBox option[value='USER-NAME']").remove();

将其放入removeUser()。功能

实际上,该函数不能从远程列表中提取用户,也不能从DOM中提取用户。 请帮助。

答案 1 :(得分:0)

检查你的回调功能。逻辑似乎没问题。我刚刚测试并替换了select的html将删除旧项目并添加新项目。这是一个fiddle for that

在成功回调函数中添加几个console.log()调用。的console.log(数据);的console.log(用户列表); console.log(listContent)并查看它们是否包含正确的数据......或者它们是否完全执行。

另一个可能的原因是检查服务器上的roleUsers列表。它可能包含已删除的用户 - 即,如果您从缓存而不是从数据库中提取它,或者在列表加载后删除它。