Question

我正在尝试使用foreach循环将数据加载到select2。

代码：

var url = "@Url.Action("Listofservices","service")";

$.get(url, function (status, val) {
                              $.each(status, function (i, val) {
                                  $(".ser").select2("data", val.Name);
                              });
                           });

由此我得到列表。这些值进入foreach循环，但不会附加到select2。

 var tr = '<tr>';
                                   tr += `'<td>
                                    <select id="services" name="services" class="form-control select2 ser">
                                         <option value=`+val.ID +`>  `+ val.Name +`</option >
                                   </select>
                                </td>'`;

在这里，我正在使用select2并从数据库中获取选定的值。它仅显示选定值，而不显示select2中的所有值。我想获取所有值，并在可能的情况下也要选择。关于如何获取select2中所有值以及从db中选择值的任何建议。预先感谢。

Answer 1

您可以像下面那样填充select2，以从控制器方法中将数据作为ajax获取

<script>
    $('#services').select2();
    var url = "@Url.Action("Listofservices", "service")";
    selected();
    function selected() {
        $.get(url, function (response, status) {
            if (status == "success") {
                $.each(response.results, function (i, item) {
                    var selected = "";
                    if (item.selected) {
                        selected = true;
                    }
                    var option = '<option ' + selected +' value="' + item.id + '">' + item.text +'</option>';
                    $('#ddlListing').append(option)
                });
            }
        });
    }
</script>

其他方法是现有的Select2可以使用如下所示的ajax来填充选项。

<script>
    var url = "@Url.Action("getlistings", "home")";
    $('#ddlListing').select2({
        ajax: {
            url: url
        }
    });
</script>

是的，对于此选项，您的响应会自动绑定到您的select2上，如下所示

{
  "results": [
    {
      "id": 1,
      "text": "Option 1"
    },
    {
      "id": 2,
      "text": "Option 2"
    },
    {
      "id": 3,
      "text": "Option 3"
    }
  ]
}

我只是在下面放了一个示例操作方法示例，该方法返回如下所示的json，

public IActionResult GetListings()
 {

            var data = new List<dynamic>();
            data.Add(new
            {
                Id = 1,
                Text = "aaa",
                selected = true,
            });
            data.Add(new
            {
                Id = 2,
                Text = "bbb",
                selected = false,
            });
            data.Add(new
            {
                Id = 3,
                Text = "ccc",
                selected = false,
            });
            return new JsonResult(new { results = data });
  }

我希望它将对您有所帮助。

使用jQuery中的foreach循环在Select2中不加载数据

1 个答案: