ASP.净的Html.当页面加载时，ListBoxFor总是选择所有选项

本文关键字：ListBoxFor 选择 选项 Html 净的 加载 ASP | 更新日期: 2023-09-27 17:51:08

我正在构建一个非常简单的表单来编辑对象的属性。其中一个属性是与它关联的其他对象的列表，所以我使用了一个双列表系统:左边是当前关联对象的列表，右边是可以添加的对象列表;下面的"添加"answers"删除"按钮将相关操作应用于相关列表中突出显示的项目。很简单。

一切都很好，除了一件事:当页面加载时，两个列表中的所有项目都被选中，即使我在创建填充列表的项目时特别设置了Selected = false。这意味着，如果用户提交表单时没有触及列表，那么"当前"列表中的所有内容将被删除，而"可用"列表中的所有内容将被添加。因为它们是多选择列表框，所以没有虚拟选项供用户选择，所以这个问题迫使他们总是删除至少一个当前项并添加至少一个可用项。即使有一个虚拟物品，它也会迫使用户去选择它，如果他们忘记了，他们的列表就会混乱。

[编辑添加:]

控制器方法的示例:

[HttpGet]
public ActionResult EditForm(int objectId)
{
    MyObject objectToEdit = _objectStore.GetObject(objectId);
    ObjectEditViewModel viewModel = new ObjectEditViewModel();
    viewModel.Object = objectToEdit;
    viewModel.AssociatedItemSelectList = objectToEdit.AssociatedItems.Select(o => new SelectListItem { Text = o.Name, Value = o.Id, Selected = false });
    viewModel.AvailableItemSelectList = _itemStore.GetAllItems().Where(o => !objectToEdit.AssociatedItems.Contains(o))
                                            .Select(o => new SelectListItem { Text = o.Name, Value = o.Id, Selected = false });
    return View(viewModel);
}

…视图只有

@Html.ListBoxFor(m => m.ItemsToAdd, Model.AvailableItemSelectList)

和

@Html.ListBoxFor(m => m.ItemsToRemove, Model.AssociatedItemSelectList)
在相关地方使用

。当页面加载时，选择列表框中的每个选项都有如下形式:

<option selected="selected" value="281">Example Item</option>

在创建列表和呈现页面之间，项目是如何被选择的?我该如何阻止它?或者，如果做不到这一点，我如何在页面加载时立即取消选中它们，以便在用户看来，好像它们开始时未选中?我有一个修复，将使页面看起来像它应该，但我想得到这个问题的根源

ASP.净的Html.当页面加载时，ListBoxFor总是选择所有选项

这可能是一个迟来的回复，但我认为原因与列表框绑定到它所引用的对象有关。例如，如果你使用ListBox而不是ListBoxFor，并给ListBox一个名字，这样它就不会绑定到任何东西，ListBox中的项目将不会被选中。但如果你给它一个名字，它就会被绑定，项目就会被选中。我和你一样遇到了同样的麻烦，只是碰巧在反复试验中遇到了这个问题:-)

我有同样的问题，并意识到它是在我的模型属性，我设置所选的项目(s)为所有。这是很难没有看到你的模型知道发生了什么，但检查你的定义ItemsToAdd和AvailableItemSelectList和分别为其他列表，并确保你没有做任何。select…ToList()在那里。

public List<SelectListItem> AvailableItemSelectList{
get
{
    var items = //get your items from repository
    return items;
}
}
public List<string> ItemsToAdd{
get{ //make sure you are not setting anything here}
set{} 
}

你也可以这样做，在页面加载时取消选择所有列表框项:

$(document).ready(function () {        
   $("#listbox").find("option").attr("selected", false);
});
相关文章：