Asp.net mvc 4 如何通过单击复选框将对象添加到列表框？

我有一个带有复选框列表和列表框的表单

我需要的是，当您选中或取消选中复选框时，它会通过在列表中添加或删除对象来修改列表框中的列表。这就是它的样子：

以下是表格该部分的代码：

<div class="row-fluid">
                                <div class="span3">
                                     <label>Fonction(s):</label>
                                </div>
                                <div class="span9">                                        
                                    @Html.ListBoxFor(contact => contact.SelectedFonctionIds, Model.ListeFonctionsSelectList, new { disabled = "disabled" })                                
                                </div>
                            </div>


                            <div class="row-fluid">
                                <div class="span5 offset3">
                                    <div class="fonctions_container">
                                            @foreach (extranetClient.Models.Classes.FonctionContact fonction in ViewBag.Fonctions)
                                            {
                                                string coche = "";
                                                if ((@Model.ListeFonctions).Any(c => c.IdFonction == fonction.IdFonction))
                                                {
                                                    coche = "checked";
                                                }

                                                <input type="checkbox" @coche id="@fonction.LibelleFonction" onclick="javascript:AjouterFonction();" value="@fonction.IdFonction" />@fonction.LibelleFonction <br />
                                            }
                                    </div> 
                                </div>
                            </div>

行动:
@Html.ListBoxFor（contact=>contact.SelectedFonctionIds，Model.listfonctionsselectlist，new{disabled=“disabled”}）
@foreach（extranetClient.Models.Classes.FonctionContact-fonction在ViewBag.Fonctions中）
{
字符串coche=“”；
if（@Model.listfonctions.Any（c=>c.IdFonction==fonction.IdFonction））
{
coche=“checked”；
}
@fonction.LibelleFonction

}

有人知道怎么做吗

---

我在考虑Ajax，但问题是它是一个强类型视图，所有数据都与一个模型关联。

不确定它是否是一个好的解决方案，但如果将列表框放入部分视图（也是强类型视图），然后放入ajoterfonction（）JavaScript将对一个操作进行Ajax调用，该操作返回一个PartialView，其中包含该列表框的更新版本？然后，使用jQuery将以前的列表框替换为新的列表框

控制器操作：

public PartialViewResult ActionName(<whatever you need here>)
{
    // Whatever logic you may need: which item was clicked, what should be added to the model object, etc....
    return PartialView("ListBoxPartial", yourModelObject);
}

在你看来，而不是

<div class="span9">                                        
    @Html.ListBoxFor(contact => contact.SelectedFonctionIds, Model.ListeFonctionsSelectList, new { disabled = "disabled" })                                
</div>

@Html.ListBoxFor（contact=>contact.SelectedFonctionIds，Model.listfonctionsselectlist，new{disabled=“disabled”}）

你应该：

<div class="span9">                                        
   @Html.Partial("ListBoxPartial", Model)                        
</div>

@Html.Partial（“ListBoxPartial”，模型）

在接收到新的列表框后，ajoterfonction（）将搜索类为“span9”的div，并用接收到的数据替换其内容

---

也许有更好的方法解决这个问题，但这是我想到的第一件事。

是啊，为什么不呢，有趣，我会检查一下并给你反馈好的，最后让我知道你是怎么做的。它起作用了，但最后，当我提交整个表格时，所选的FontionId未与联系人关联…未正确绑定。你能给我看看生成的html标记吗？另外，看看这是否有帮助：我尝试了他们在链接中所说的，但没有更多的事情发生。我将向您显示生成的局部视图标记：

<div class="span9">                                        
   @Html.Partial("ListBoxPartial", Model)                        
</div>