替换 Mvc 部分视图后的 select2 jquery 不再起作用

Question

我的代码被放置在这样的局部视图中：

@Html.DropDownListFor(model => model.UserProfileInstance.Employee_Id, new SelectList(Model.EmployeeList, "Id", "FullName"), new { id = "e1" })
<script>
  $(document).ready(function() {
        $("#e1").select2();
      }
</script>

第一次正常工作，但是Ajax刷新部分视图表单后，再次正常加载但无法搜索，输入框被禁用。 我在multiple select2中没有这个问题。

Answer 1

您需要重新附加您的插件。最简单的方法是将您的插件初始化代码不仅放在$(document).ready() 函数中，而且放在.ajaxComplete() 中。

$(document).ajaxComplete(function() {
  $("#e1").select2();
});

这将在从 ajax 添加到 DOM 后，在新添加的元素上初始化您的插件。

但是，如果您的视图上有另一个 ajax 调用，请小心。在这种情况下，您应该将初始化代码放在刷新局部视图调用的success 回调中。