用modal来show一个对话框

dialog.modal({
backdrop:true,
keyboard:true,
show:true
});
  • 1
  • 2
  • 3
  • 4
  • 5

然后再modal中初始化select2

dialog.find("select").select2({
formatNoMatches: function() {
return "没有选项";
},
placeholder: "请选择...",
minimumResultsForSearch: 0,
allowClear: false
});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

这时候select2的搜索框无法输入,一般有两方面的原因 
1.检查下modal的div中是否有tabindex=”-1”,这个属性

<div class="modal fade in" id="dialog-new-draft">
  • 1

2.js代码中加入

$.fn.modal.Constructor.prototype.enforceFocus = function () {};
  • 1

满足这两个一般就没问题了。

在BootStrap的modal中使用Select2搜索框无法输入的更多相关文章

  1. Bootstrap3 模态框 select2搜索框无法输入

    <div class="modal fade" role="dialog" aria-hidden="true" data-backd ...

  2. 在BootStrap的modal中使用Select2

      bootstrap 3 $.fn.modal.Constructor.prototype.enforceFocus = function() {}; bootstrap4 $.fn.modal.C ...

  3. Bootstrap 模态框 select2搜索框无法输入

    去掉模态框的div中的 tabindex="-1" 这个属性 <div class="modal fade" role="dialog" ...

  4. 解决select2在bootstrap的modal中默认不显示的问题

    在Bootstrap中的Modal,select2插件会有不显示,因为其z-index小于modal,还有另外一个问题是,修正z-index之后,select2不会自动失去焦点的问题.代码解决如下: ...

  5. select2的搜索框不能输入搜索内容

    按照select2官网配置完后,搜索框弹出后无法输入内容,究竟怎么回事,于是在其他页面尝试了select2,发现可以啊,为什么在这个地方不可以,终于找到了造成这个问题的不同之处:select2在模态对 ...

  6. select2搜索框查询加遍历

    <div class="form-group"> <label class="control-label col-sm-1 no-padding-rig ...

  7. 解决 Ant Design Modal 中的 Select 选项框不能显示的问题

    antd 的 select 在 modal 里不能显示候选框 代码示例 <a-modal> <a-select> <!-- options --> </a-s ...

  8. BootStrap 的modal 中使用typeahead

    刚开始怎么也不现实,在页面上显示正常. 调试发现是下拉框被modal遮挡住了, 找到样式dropdown-menu    修改z-index值为2000后,显示正常.(modal的z-index值为1 ...

  9. bootstrap --- 在 modal中的 datetimepicker 关闭 ,会造成 modal也会被关闭.

    这个大概是事件冒泡造成的. 解决办法: <form id="userForm" class="form-horizontal"> <input ...

随机推荐

  1. 读取txt数据存入数据库中

    http://blog.csdn.net/daditao/article/details/18899469

  2. matrix_chain_order

    to calculate the min step of multiplicate some matixs package dynamic_programming; public class matr ...

  3. C# 数据推送 实时数据推送 轻量级消息订阅发布 多级消息推送 分布式推送

    前言 本文将使用一个NuGet公开的组件技术来实现数据订阅推送功能,由服务器进行推送数据,客户端订阅指定的数据后,即可以接收服务器推送过来的数据,包含了自动重连功能,使用非常方便 nuget地址:ht ...

  4. window.location.href webkit不兼容

    window.event.returnValue=false; 在location.href后加上后修复 来自为知笔记(Wiz)

  5. LCA - Tarjan 算法

    void dfs(int u) { ; i <= n; i++) { if(visit[i]&&ask[u][i]) { LCA[u][i] = Find(i); } } vis ...

  6. 如何使用Nunit进行测试(Visual Studio 2017 comminity)

    一.环境 操作系统:Windows 版本 10.0.15063 64位 集成环境:Visual Studio 2017 comminity(此后简称vs2017) 编程语言:C# 目标框架:.NET ...

  7. ios-UILabel居中随内容自适应,后面的控件跟在其后

    如图绿蓝框所示,UILabel显示名字,Label框随名字长短而自适应,后面的性别图片跟在其后显示 分两部分:第一部分先布局 //名字 self.nameLab = [[UILabel alloc]i ...

  8. SQL Server 幻读 的真实案例

    数据库中有表[01_SubjectiveScoreInfo],要实现表中的数据只被查出一次,此表数据量较大,有三四百万数据.表结构也确实不是很合理,无法修改表结构,即使是新增一个字段也会有相当大的修改 ...

  9. PythonStudy——编程基础 Python Primary

    1.什么是编程语言 语言:  一个事物与另外一个事物沟通的介质 .编程语言是程序员与计算机沟通的介质. 编程: 将人类内识别的语言转化为机器能识别的指令,这种过程就叫做编程. 注:最终这些指令会被转化 ...

  10. (拼接SQL语句)mysql中date类型,datetime类型

    : , . _ - /  %  &  # @ ! * | [ ] { }   ;  + = update ky set date = '18,9-2'  where id  = 1  // 2 ...