如何在 asp.net 中使用 select2 返回下拉列表的值？

Posted 2023-05-07

【中文标题】如何在 asp.net 中使用 select2 返回下拉列表的值？

【英文标题】：How to return a value/s of a dropdownlist using select2 in asp.net?

【发布时间】：2019-09-24 05:02:37

【问题描述】：

我目前正在学习 asp.net 中的前端开发，尤其是在涉及下拉列表时，我似乎缺乏一些基本的理解。我的目标是我认为应该非常直接和简单 - 生成一个多选 Select2 下拉列表，它回发所选选择列表项的 值。

出于某种原因，尽管阅读了 MS 文档和类似的 *** 问题，但我根本无法弄清楚如何做到这一点。我可以生成下拉列表、选择项目，甚至返回单个值。但是在提交（用于js处理）之前我无法获取项目的值，因此我可以返回所有选定值的列表（或连接字符串）。

我的代码在下面，您可以在 javascript 中看到我一直在尝试以不同的方式访问值，但值甚至没有在检查元素的 li 上设置。

如果有人能解释如何正确地形成这个下拉列表以便我可以检索我需要的值（又名“80”和“81”），那就太好了。

控制器

public ActionResult About()
        
            AboutViewModel viewModel = new AboutViewModel();

            viewModel.Movies = new List<SelectListItem>()
            
                new SelectListItem()
                
                    Text = "Honey I Shrunk The Kids",
                    Value = "80"
                ,
                new SelectListItem()
                
                    Text = "Shrek 2",
                    Value = "81"
                
            ;
            return View(AboutViewPage, viewModel);
        

[HttpPost]
public ActionResult About(AboutViewModel viewModel)

    return View();

查看

   <div>
        @using (html.BeginForm("About", "Home"))
        

            @Html.DropDownList("Result", new SelectList(Model.Movies, "Value","Text"), new  @class = "values js-example-basic-single", @multiple = "multiple", @Id="movies" );

            <input type="submit" value="Submit" class="submit" onclick="collectMovies();" />
        

    </div>



    <script>
        function collectMovies() 
            var test1= $('.select2-selection__choice').val();
            var testString = "";

            for (var i = 0; i < test1.length; i++) 
                testString += test1[i];
            
        


        $(document).ready(function () 
            $('.js-example-basic-single').select2();
        );
    </script>

【参考方案1】：

当多选控件发布到服务器时，所选值的集合由 ASP.NET 处理成一个逗号分隔的列表。 MVC 模型绑定系统非常高兴地将这个集合视为一个数组。如果选中的值可以解析成int，可以用一个int数组来表示posted values

public class AboutViewModel 

   public int[] Result get;set;


[HttpPost]
public ActionResult About(AboutViewModel viewModel)

    return View();

Source