在BootStrap的modal中使用Select2搜索框无法输入
用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搜索框无法输入的更多相关文章
- Bootstrap3 模态框 select2搜索框无法输入
<div class="modal fade" role="dialog" aria-hidden="true" data-backd ...
- 在BootStrap的modal中使用Select2
bootstrap 3 $.fn.modal.Constructor.prototype.enforceFocus = function() {}; bootstrap4 $.fn.modal.C ...
- Bootstrap 模态框 select2搜索框无法输入
去掉模态框的div中的 tabindex="-1" 这个属性 <div class="modal fade" role="dialog" ...
- 解决select2在bootstrap的modal中默认不显示的问题
在Bootstrap中的Modal,select2插件会有不显示,因为其z-index小于modal,还有另外一个问题是,修正z-index之后,select2不会自动失去焦点的问题.代码解决如下: ...
- select2的搜索框不能输入搜索内容
按照select2官网配置完后,搜索框弹出后无法输入内容,究竟怎么回事,于是在其他页面尝试了select2,发现可以啊,为什么在这个地方不可以,终于找到了造成这个问题的不同之处:select2在模态对 ...
- select2搜索框查询加遍历
<div class="form-group"> <label class="control-label col-sm-1 no-padding-rig ...
- 解决 Ant Design Modal 中的 Select 选项框不能显示的问题
antd 的 select 在 modal 里不能显示候选框 代码示例 <a-modal> <a-select> <!-- options --> </a-s ...
- BootStrap 的modal 中使用typeahead
刚开始怎么也不现实,在页面上显示正常. 调试发现是下拉框被modal遮挡住了, 找到样式dropdown-menu 修改z-index值为2000后,显示正常.(modal的z-index值为1 ...
- bootstrap --- 在 modal中的 datetimepicker 关闭 ,会造成 modal也会被关闭.
这个大概是事件冒泡造成的. 解决办法: <form id="userForm" class="form-horizontal"> <input ...
随机推荐
- 四:(之七_如何与运行中容器交互)Dockerfile语法梳理和实践
1.指定网络连接方式:--net=”” (bridge/host/none/container: 四种类型) 注:192.168.33.18 此IP是在vagrantfile中指定的虚拟机IP:c ...
- python读取与写入csv,txt格式文件
python读取与写入csv,txt格式文件 在数据分析中经常需要从csv格式的文件中存取数据以及将数据写书到csv文件中.将csv文件中的数据直接读取为dict类型和DataFrame是非常方便也很 ...
- 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 ...
- java基础学习之接口
接口可以说是一个特殊的抽象类,接口里的方法都是抽象方法, 接口的特点: 1.一个类可以实现多个接口,也可以在继承一个类后继续实现多个接口(多实现间接支持了类的多继承) 2.接口可以继承另一个接口,并且 ...
- c++结构体的排序
出处:https://blog.csdn.net/weixin_39460667/article/details/82695190 引入头文件 #include<algorithm> 结构 ...
- wpf 控件简单介绍
- Fescar Example-Spring Cloud
项目说明 本项目演示如何使用 Fescar Starter 完成 Spring Cloud 应用的分布式事务接入. 准备工作 在运行此示例之前,你需要先完成如下几步准备工作: 配置数据库 创建 UND ...
- C# 流水号生成器开发
前言 本文将使用一个Nuget公开的组件技术来实现一个流水号生成器,提供了一些简单的API,来方便的实现一个通用的流水号. 在visual studio 中的NuGet管理器中可以下载安装,也可以直接 ...
- 我在MySQL免安装版使用过程中遇到的问题记录
我的MySQL版本为:mysql-5.7.16-winx64 安装时间为:2016年5月10号 由于是免安装版,下载好压缩文件之后解压到特定目录下,再打开命令行运行几行命令即可. 在一次操作中,发现无 ...
- JAVA002标识符的命名规则、关键字
标志符命名规则: 1.标志符可以由字母.数字.下划线(_)和美元符号($)组成,不能以数字开头($sen.Void) 2.标志符严格区分大小写 3.标志符不能是Java的关键字和保留字(eg:publ ...