1

我在 MVC razor 中生成了一个表单,用于在列表框(已分配和未分配)之间移动联系人。

我正在使用 jQuery<option>在列表框之间移动元素,然后selected在提交表单时使用属性绑定它们。

@model SiteAssignmentViewModel
@using (Html.BeginForm())
{
    @Html.ListBox("AvailableContacts", new SelectList(Model.Contacts.Where(p => !Model.SelectedContactIDs.Contains(p.ID)), "ID", "FullName"))
    <br />
    <br />
    <input type="button" value=">" onclick="MoveListBoxItems('AvailableContacts', '@Html.IdFor(m => m.SelectedContactIDs)');" />
    <input type="button" value="<" onclick="MoveListBoxItems('@Html.IdFor(m => m.SelectedContactIDs)', 'AvailableContacts');" />
    <br />
    <br />
    @Html.ListBoxFor(model => model.SelectedContactIDs, new SelectList(Model.Contacts.Where(p => Model.SelectedContactIDs.Contains(p.ID)), "ID", "FullName"))
    <br />
    <br />
    <input type="submit" value="OK" onclick="BindListBoxItems('@Html.IdFor(m => m.SelectedContactIDs)');" />
}

<script>
    function MoveListBoxItems(fromListBox, toListBox) {
        $("#" + fromListBox).find("option:selected").appendTo($("#" + toListBox));
        $("#" + toListBox).find("option").attr("selected", false);
    }

    function BindListBoxItems(listBox) {
        $("#" + listBox).find("option").attr("selected", true);
    };
</script>

完美使用 Chrome 时,您会看到在视图中选择的选项然后提交到服务器。

然而,在 Firefox 和 IE 中,该函数被调用,但在提交表单之前未附加 selected 属性。如果我将按钮类型更改为button按预期选择所有选项(现在表单不会提交)。我尝试用以下相同的方法包装表单提交:

<input type="submit" value="OK" onclick="SubmitForm('@Html.IdFor(m => m.SelectedContactIDs)');" />
<script>
    function SubmitForm() {
        $("#" + listBox).find("option").attr("selected", true);
        $("#contactsForm").submit();
    }
</script>

这对 Firefox 中的行为没有任何影响,我在控制台上没有收到警告问题,也没有在服务器上收到任何绑定错误。使用元素检查器时,似乎在表单提交之前根本没有附加属性。

谁能解释这种行为以及如何解决它?

4

1 回答 1

0

您可以在提交按钮上使用点击事件。我看不到你所有的 HTML 标记,但是:

<input type="submit" value="OK" />

<script>
$(document).ready(function(){

   $("input[type='submit']").bind("click", function(){

      // code would go here
      SubmitForm();

      return false;
   });

   function SubmitForm() {
       $("#" + listBox).find("option").attr("selected", true);
       $("#contactsForm").submit();
   }

});
</script>

你也可以试试 $("form").submit();

于 2013-11-07T21:10:57.003 回答