bootstrap-table之通用方法( 时间控件,导出,动态下拉框, 表单验证 ,选中与获取信息)

1.bootstrap-table 单击单行选中
$('#gzrwTable').on('click-row.bs.table', function(e, row, $element) {
$('.success').removeClass('success');// 清除前一次操作已选中行的选中状态
$($element).addClass('success');// 选中行添加选中状态
});
2.bootstrap-table 获取选中行信息
function getSelectedRow() {
var index = $('#gzrwTable').find('tr.success').data('index');
return $('#gzrwTable').bootstrapTable('getData')[index];
}
3.时间控件 填写默认当前时间信息
var date = new Date();
var mon = date.getMonth() 1;
var day = date.getDate();
var nowDay = date.getFullYear() "-"
(mon < 10 ? "0" mon : mon) "-"
(day < 10 ? "0" day : day);
$("#endTime").val(nowDay);
4.bootstrop-table 验证表单信息 根据name值
function checkForm(formId) {
$(formId).bootstrapValidator({
message : 'This value is not valid',
feedbackIcons : {
valid : 'glyphicon glyphicon-ok',
invalid : 'glyphicon glyphicon-remove',
validating : 'glyphicon glyphicon-refresh'
},
fields : {
task : {
group : '.col-sm-10',// 对应前台input的class占用宽度
validators : {
notEmpty : {
message : '请填任务内容!'
}
}
},
tel : {
group : '.col-sm-4',// 对应前台input的class占用宽度
validators : {
notEmpty : {
message : '请填写电话!'
},
phone : {
country : "CN",
message : '电话号码格式错误'
}

}
},
area : {
group : '.col-sm-4',// 对应前台input的class占用宽度
validators : {
numeric : {
message : '请填写数字!'
}
}
},
endtime : {
group : '.col-sm-4',// 对应前台input的class占用宽度
validators : {
notEmpty : {
message : '请选择截止日期!'
}
}
},
}
});
}
// 获取表单验证数据
var bootstrapValidator = $("#addTaskForm").data('bootstrapValidator');
// 验证表单
bootstrapValidator.validate();
// 判断是否全部验证通过 为通过重新验证,通过执行ajax
if (!bootstrapValidator.isValid()) {
return;
}
5.动态加载下拉框的内容 多选 单选都一样
function setUser() {
$("#receiver")[0].options.length = 0;
$.ajax({
type : 'POST',
url : $.el.Register.AppUrl "gzrw/selectUser",
dataType : 'json',
success : function(data) {
$("#receiver")[0].options.add(new Option('请选择', ''));
for (var i = 0; i < data.length; i ) {
$("#receiver")[0].options.add(new Option(data[i].name,
data[i].id));
}
// 下拉框内容刷新
$("#receiver").selectpicker('refresh');
},
error : function(e) {
}
});
}
6.导出事件
$("#btnExport").click(function() {
var tableNum = $("#sgnqTable thead tr th").length;
$("#sgnqTable").tableExport({
type : 'excel', // 'csv', 'txt', 'sql', 'json', 'xml', 'excel',
// 'doc', 'png' or 'pdf'
fileName : '表名',
escape : 'false',
ignoreColumn : [ tableNum - 1, tableNum - 4 ],// 不导出的列
});
});


更多专业前端知识,请上 【猿2048】www.mk2048.com

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/364213.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

如何取得好的软件设计

[转贴] 段先德 2006-5-20 似乎作为一个软件开发者&#xff0c;就注定要背着沉重的行囊&#xff0c;穿行在茂密的热带丛林里&#xff0c;酷热&#xff0c;没有风&#xff0c;只有腐烂的植被、浓浓的瘴气、不时从肩膀上爬过的毒蜘蛛和从脚背上“嗖”地窜过的毒蛇。汗流浃背&…

老男孩mysql参数配置_MySQL启动相关参数解析

1.basedir /usr/local/mysql代表MySQL安装路径2.datadir /usr/local/mysql/data代表MySQL的数据文件路径3.port 3306指定MySQL的侦听端口4.log-error/usr/local/mysql/data/M00006.err记录MySQL启动日志和运行错误日志5.bind-address(默认是*)*代表接受所有来自IPV4、IPV6主…

CSS基础学习-15-1.CSS 浏览器内核

转载于:https://www.cnblogs.com/songsongblue/p/11047935.html

gitlab提交代码push,触发jenkins构建

一、安装插件 Build Authorization TokenRoot Gitlab Hook Plugin二、配置 在linux上执行命令 openssl rand -hex 12获得token&#xff1a; 632f873225efdb5b7e5da411 去掉jenkins的 CSRF Protection设置 找到触发构建的项目&#xff0c;修改触发器 在gitlab的项目中&#xff0…

5分钟搞定jQuery zepto.js 面向对象插件

今天分享一下快速使用jQuery zepto.js的技巧&#xff0c;需要的记得收藏 1.jQuery的引入&#xff1a;本地下载jQuery(后面简称jq)的源文件&#xff0c;开发版本使用非min版&#xff0c;线上使用min版&#xff0c;zepto.js类似&#xff0c;同样的一些基于jq的插件也是如此用法&…

使用JavaConfig的SpringMVC4 + Spring Data JPA + SpringSecurity配置

在本文中&#xff0c;我们将看到如何使用JavaConfig配置和集成SpringMVC4&#xff0c;带有Hibernate的Spring Data JPA和SpringSecurity。 1.首先让我们在pom.xml中配置所有必要的依赖项 <project xmlns"http://maven.apache.org/POM/4.0.0" xmlns:xsi"htt…

阅读《Google成功七堂课》

最近拜读了罗耀宗的《Google成功七堂课》&#xff0c;其中的观点很是不错&#xff0c;这里记录一下。第一课&#xff1a;打破规则第二课&#xff1a;打造更好的新产品第三课&#xff1a;以世界为实验室第四课&#xff1a;以用户的体验为念第五课&#xff1a;创造与分享价值第六…

mysql主从安装配置_如何安装和配置mysql主从同步

1)安装mysql&#xff1a;略2)启动mysqld:mysqld3)修改mysql的root 用户的password&#xff1a;mysql -u rootuse mysqlupdate user set passwordpassword(“”) where user”root”;grant all privileges on *.* to root’%’ identified by ‘’ with grant option;flush priv…

R语言中级--自定义方程

#求电费&#xff0c;&#xff1c;50,85折&#xff0c;50--120,50元/度&#xff0c;&#xff1e;120,1.15倍 myfunction <- function(deg,price 50){if(deg>120)energyprice deg*price*1.15else if(deg<80)energyprice deg*price*0.85else energyprice deg*pricere…

docker pull 镜像报错

[rootlocalhost ~]# docker pull ningx Using default tag: latest Trying to pull repository docker.io/library/ningx ... Get https://registry-1.docker.io/v2/: x509: certificate has expired or is not yet valid 上述的这种错误是时间有问题&#xff0c;更新一下时间…

mysql单表索引个数_MySQL性能:多个表与单个表和分区上的索引

小编典典创建20,000个表是一个坏主意。您很快将需要40,000个表&#xff0c;然后更多。我在《SQL反模式》一书中将此综合症称为Metadata Tribbles。您每次计划创建“每X表格”或“每X列”时都会看到这种情况。当您有成千上万个表时&#xff0c;这确实会导致实际的性能问题。每个…

在JDK 8中可通过反射获得构造函数/方法参数元数据

JDK 8较不为人所知的一项新 功能是在编译的Java类中包含参数元数据的可选功能[JDK增强建议&#xff08; JEP &#xff09; 118 ]。 此功能允许Java应用程序在运行时通过反射访问此参数元数据信息。 Java Tutorial的Reflection API路径包括一个名为“ 获取方法参数的名称”的课…

Web控件TreeView展开无闪烁的两个解决方法

已经无数次见到有人提出这个问题了。。。。。 第一种。。。。。 用.net控件TreeView而展开时不刷新的变通方法主要有以下步骤&#xff1a; 1。在Page_Load中为你的TreeView添加以下属性&#xff0c;这句话为TreeView添加Click时的回发事件。 TreeView1.Attributes["On…

基于面向对象的图片轮播(js原生代码)

无论你想走多远&#xff0c;你都需要不断地走下去。前端最精华的便是原生的js,这也是我们前端工程师的技术分层的重要指标&#xff0c;也提现这你的代码能力&#xff0c;开发的水平。废话不多说&#xff0c;进入今天的主要分享————基于面向对象思想的图片轮播。其效果如下所…

Spring boot 上传文件大小限制

1.spring boot 1.x 版本 application.properties 文件中 位置在&#xff08;resources下&#xff09; spring.http.multipart.maxFileSize 10Mb spring.http.multipart.maxRequestSize100Mb 2.spring boot 2.x 版本 application.properties 文件中 位置在&#xff08;resourc…

C#定义只能处理枚举类型的泛型类型

1 internal sealed class GenericTypeThatRequireAnEnum<T>2 {3 public static int age 12; //该 static 字段在不同的封闭类型之间是独立不共享的4 5 //静态构造器针对每个封闭类型都会执行一次&#xff0c;泛型类型定义静态构造器的目的就是为了保证传递的类…

电脑注册表被停用

“开始→运行”&#xff0c;输入“Gpedit&#xff0e;msc”后回车&#xff0c;打开“组策略”。然后依次展开“用户配置→管理模板→系统”&#xff0c;双击右侧窗口中的“阻止访问注册表编辑工具”&#xff0c;在弹出的窗口中选择“已禁用”&#xff0c;“确定”后再退出“组策…

Spring应用程序与JNDI连接池的集成测试

我们都知道&#xff0c;无论何时连接到数据库&#xff0c;都需要使用连接池。 所有使用JDBC 4类的现代驱动程序都支持它。 在本文中&#xff0c;我们将概述Spring应用程序中的连接池&#xff0c;以及如何在非JEE环境&#xff08;例如测试&#xff09;中处理相同的上下文。 在S…

jsp 上传转码_最完整的处理jsp处理乱码问题步骤,不需要手工转码

以编码格式为UTF-8为例1&#xff0c;jsp页面文件编码格式&#xff0c;在eclipse右键-》properties-》resource-》text file encode修改该UTF-82&#xff0c;jsp页面上的跟上面一样&#xff0c;为文件存储格式&#xff0c;按此格式存储文件&#xff0c;并编译里面汉字3&#xff…

CSS未知宽高元素水平垂直居中

方法一 &#xff1a;table、cell-table 思路&#xff1a;显示设置父元素为&#xff1a;table&#xff0c;子元素为&#xff1a;cell-table&#xff0c;这样就可以使用vertical-align: center&#xff0c;实现水平居中优点&#xff1a;父元素&#xff08;parent&#xff09;可以…