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

时间:2019-05-06 14:30:11

标签: javascript asp.net drop-down-menu jquery-select2 html-helper

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

由于某些原因,尽管阅读了MS文档和类似的StackOverflow问题,我还是无法弄清楚该如何做。我可以生成下拉列表,选择项目,甚至返回单个值。但是我无法在提交(用于js处理)之前获取项目的值,这样我就可以返回所有选定值的列表(或隐含字符串)。

我的代码在下面,您可以在javascript中尝试以不同方式访问值,但该值甚至没有在inspect元素中的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 个答案:

答案 0 :(得分:0)

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

public class AboutViewModel 
{
   public int[] Result {get;set;}
}

[HttpPost]
public ActionResult About(AboutViewModel viewModel)
{
    return View();
}

Source