用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. 四:(之七_如何与运行中容器交互)Dockerfile语法梳理和实践

    1.指定网络连接方式:--net=””   (bridge/host/none/container: 四种类型) 注:192.168.33.18 此IP是在vagrantfile中指定的虚拟机IP:c ...

  2. python读取与写入csv,txt格式文件

    python读取与写入csv,txt格式文件 在数据分析中经常需要从csv格式的文件中存取数据以及将数据写书到csv文件中.将csv文件中的数据直接读取为dict类型和DataFrame是非常方便也很 ...

  3. centos7下zabbix4.0配置磁盘IO监控

    一:准备 1.1:安装sysstat yum -y install sysstat 1.2:安装zabbix-get yum install -y zabbix-get.x86_64 1.3:iost ...

  4. java基础学习之接口

    接口可以说是一个特殊的抽象类,接口里的方法都是抽象方法, 接口的特点: 1.一个类可以实现多个接口,也可以在继承一个类后继续实现多个接口(多实现间接支持了类的多继承) 2.接口可以继承另一个接口,并且 ...

  5. c++结构体的排序

    出处:https://blog.csdn.net/weixin_39460667/article/details/82695190 引入头文件 #include<algorithm> 结构 ...

  6. wpf 控件简单介绍

  7. Fescar Example-Spring Cloud

    项目说明 本项目演示如何使用 Fescar Starter 完成 Spring Cloud 应用的分布式事务接入. 准备工作 在运行此示例之前,你需要先完成如下几步准备工作: 配置数据库 创建 UND ...

  8. C# 流水号生成器开发

    前言 本文将使用一个Nuget公开的组件技术来实现一个流水号生成器,提供了一些简单的API,来方便的实现一个通用的流水号. 在visual studio 中的NuGet管理器中可以下载安装,也可以直接 ...

  9. 我在MySQL免安装版使用过程中遇到的问题记录

    我的MySQL版本为:mysql-5.7.16-winx64 安装时间为:2016年5月10号 由于是免安装版,下载好压缩文件之后解压到特定目录下,再打开命令行运行几行命令即可. 在一次操作中,发现无 ...

  10. JAVA002标识符的命名规则、关键字

    标志符命名规则: 1.标志符可以由字母.数字.下划线(_)和美元符号($)组成,不能以数字开头($sen.Void) 2.标志符严格区分大小写 3.标志符不能是Java的关键字和保留字(eg:publ ...