Question

这是我在这个论坛的第一条消息，感谢您的帮助，如果我在这里犯了更大的错误，请抱歉。

我正在尝试实现select2 JQuery自动完成组合框。

我复制了一些代码而我无法看到我的错误在哪里，但编辑文本看起来像普通的编辑文本而是更改为Select2，JavaScrypt由于某种原因无效。

这是我的代码：

我的indexcshtml中的引用：

<link href="~/Content/css/select2.css" type="text/css" rel="stylesheet" />
<script src="~/Scripts/jquery-3.1.0.js"></script>
<script src="~/Scripts/select2.js"></script>
<script src="~/Scripts/jquery.validate.js"></script>
<script src="~/Scripts/jquery.validate.unobtrusive.js"></script>
<script src="~/Scripts/bootstrap.js"></script>
<script src="~/Scripts/bootstrap.min.js"></script>

我的文本框应该在像cyndarela这样的Combobox中进行转换！

@using (Html.BeginForm())
{

    @Html.TextBoxFor(a => a.SupplierId, new { id = "supplier" })  @Html.ValidationMessageFor(a => a.SupplierId)
    <br />
    <button type="submit">Submit</button>
}

最后我的JavaScrypt：

<script >



 $(document).ready(function () {

       var pageSize = 20;

       var optionListUrl = '@Url.Action("GetProducts", "Purchases")';

    //Method which is to be called for populating options in dropdown //dynamically

       $('#supplier').select2(

       {

           ajax: {

               delay: 150,

               url: optionListUrl,
               //url: '/Purchases/GetProducts',

               dataType: 'json',



               data: function (params) {

                   params.page = params.page || 1;

                   return {

                       searchTerm: params.term,

                       pageSize: pageSize,

                       pageNumber: params.page

                   };

               },

               processResults: function (data, params) {

                   params.page = params.page || 1;

                  return {

                       results: data.Results,

                       pagination: {

                           more: (params.page * pageSize) < data.Total

                       }

                   };

               }

           },

           placeholder: "-- Select --",

           minimumInputLength: 0,

           allowClear: true,

   });

});

</script>

就像#supplier在脚本中不起作用

感谢您的时间！

Answer 1

我有同样的问题。指令

@Scripts.Render("~/bundles/scripts")

在布局视图中包含所有脚本，它们有时会有一些指令来处理.send2（）

因此，您可以删除该行，只需导入所需的脚本.js文件，包括select2。

ASP.NET MVC5 Select2无法正常工作

1 个答案: