多个列表框的jQuery代码有什么问题? [英] What's wrong with this jQuery code for multiple listboxes?

问题描述

我无法在MVC 5应用程序中使用以下jQuery代码(它不会在列表框之间传输所选项目):

I can't get the following jQuery code to work (it doesn't transfer selected items between listboxes) in an MVC 5 app:

<script>
        $(function () {
            $("add").click(function () {
                $("#listBoxAvail > option:selected").each(function () {
                    $(this).remove().appendTo("#listBoxSel");
                });
            });

            $("remove").click(function () {
                $("#listBoxSel > option:selected").each(function () {
                    $(this).remove().appendTo("#listBoxAvail");
                });
            });
        });

    </script>

带有列表框的标记的其余部分是:

The rest of the markup with the listboxes is:

@using (Html.BeginForm())
        {
           @Html.ListBoxFor(m => m.SelectedAttributes, Model.Attributes, new {id="listBoxAvail", SIZE = 5} ) 

            <input type="submit" name="add" 
                   id="add" value="MoveRight" />

            <input type="submit" name="remove" 
                   id="remove" value="MoveLeft" />

            <input type="submit" name="remove-all" id="remove-all" value="RemAll" />

            <input type="submit" name="select-all" id="select-all" value="SelAll" />

            @Html.ListBoxFor(m => m.SelectedAttributes2, Model.SelectedItems, new { id = "listBoxSel", SIZE = 5})
        } 
    </div>

ViewModel是:

The ViewModel is:

public class OptInViewModel
    {
        public IEnumerable<string> SelectedAttributes { get; set; }
        public IEnumerable<string> SelectedAttributes2 { get; set; }
        public IEnumerable<SelectListItem> Attributes { get; set; }
        public IEnumerable<SelectListItem> SelectedItems { get; set; }
    }

控制器是:

 public ActionResult Index()
        {
            AttributeEntities db = new AttributeEntities();
            List<SelectListItem> listSelectListItems = new List<SelectListItem>();
            List<SelectListItem> listSelItems = new List<SelectListItem>();

            foreach (var attributes in db.HarmonyAttributes)
            {
                SelectListItem selectList = new SelectListItem
                {
                    Text = attributes.AttributeName,
                    Value = attributes.AtrributeLabel,
                    Selected = false
                };
                listSelectListItems.Add(selectList);
            }

            foreach (var sel in db.SelectedHarmonyAttributes)
            {
                SelectListItem selList = new SelectListItem
                {
                    Text = sel.CustomLabel,
                    Value = sel.HarmonyAttribute_ID.ToString(),
                    Selected = false
                };
                listSelectListItems.Add(selList);
            }

            OptInViewModel viewModel = new OptInViewModel
            {
                Attributes = listSelectListItems,
                SelectedItems = listSelItems
            };
        return View(viewModel);
    }
}

我不知道为什么JQuery脚本不起作用.我在做什么错了?

I can't figure out why the JQuery script won't work. What am I doing wrong?

推荐答案

像选择器一样，您正在尝试将处理程序分配给元素"add":

Looks like selector is wrong, you are trying to assign handler to element "add":

$("add")

代替ID为"add"的元素

instead of element with id "add"

$("#add")

与删除"元素相同.

这篇关于多个列表框的jQuery代码有什么问题?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！