boostrap ajax表单验证提交
===============================================================================
1.
|
1
|
<link href="<%=basePath %>bootstrap/css/bootstrap-datetimepicker.min.css" rel="external nofollow" rel="stylesheet" media="screen"> |
===============================================================================
$(function(){/* 文档加载,执行一个函数*/// $(".submit_review").attr({"disabled":"disabled"}); $('#defaultForm').bootstrapValidator({ message: 'This value is not valid', feedbackIcons: {/*输入框不同状态,显示图片的样式*/ valid: 'glyphicon glyphicon-ok', invalid: 'glyphicon glyphicon-remove', validating: 'glyphicon glyphicon-refresh' }, fields: {/*验证*/ company_name: {/*键名username和input name值对应*/ validators: { notEmpty: {/*非空提示*/ message: '公司名称不能为空' }, // stringLength: {/*长度提示*/ // min: 6, // max: 30, // message: '用户名在6到30之间' // }/*最后一个没有逗号*/ } }, company_id: { validators: { notEmpty: { message: '公司ID不能为空' }, } }, equipment_ip: { validators: { notEmpty: { message: '设备IP不能为空' }, regexp: { regexp: /^(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])\.(\d{1,2}|1\d\d|2[0-4]\d|25[0-5])$/, message: '设备IP不合法' } } }, } }) });===============================================================================
|
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
|
$("#btn_reset").click(function(event) { /* Act on the event */ $('#defaultForm').data('bootstrapValidator').resetForm(true); }); $("body").on('click', '#btn_submit_add', function(event) { /* Act on the event */ $('#defaultForm').bootstrapValidator('validate'); var flag = $("#defaultForm").data('bootstrapValidator').isValid(); if (!flag) { toastr.error("填写有误,请重新填写!"); } else { $.post('addEquipmentInfoCheck.action', { "equipmentInfoCheck.companyId": $("#company_id").val(), "equipmentInfoCheck.companyName": $("#company_name").val(), "equipmentInfoCheck.machineRoom": $("#computer_room").val(), "equipmentInfoCheck.equipmentCabinet": $("#cabinet").val(), "equipmentInfoCheck.deviceType": $("#equipment_type").val(), "equipmentInfoCheck.deviceName": $("#equipment_name").val(), "equipmentInfoCheck.deviceIp": $("#equipment_ip").val(), "equipmentInfoCheck.deviceBrand": $("#equipment_brand").val(), "equipmentInfoCheck.deviceModel": $("#equipment_model").val(), "equipmentInfoCheck.position": $("#shelf_position").val(), "equipmentInfoCheck.deviceSn": $("#equipment_sn").val(), "equipmentInfoCheck.devicePn": $("#equipment_pn").val(), "equipmentInfoCheck.state":1 }, function(data, textStatus, xhr) { /*optional stuff to do after success */ if (textStatus == "success") { // e.preventDefault(); $('#defaultForm').data('bootstrapValidator').resetForm(true); $("#myModal_add").modal('hide'); toastr.success("提交成功"); }else{ $("#myModal_add").modal('hide'); toastr.error("提交失败"); } }); } }); |
boostrap ajax表单验证提交的更多相关文章
- jQuery Validatede 结合Ajax 表单验证提交
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- jquery php ajax 表单验证
本实例用到 JQuery 类库本身的函数和功能,所有表单信息利用 PHPMailer 类库邮件的形式发送. .创建一个表单 html 页面 表单部分 html 代码 以下为引用内容: &l ...
- 表单验证提交——submit与button
之前做东西接触过表单验证提交,但是都是为了完成工作,做完就做完了,没有注过表单验证提交有几种方法,各方法都有啥区别.今天瞎折腾了一下,对他们研究了一下,如下是我个人的理解: submit: 从字面上看 ...
- 第一百五十四节,封装库--JavaScript,表单验证--提交验证
封装库--JavaScript,表单验证--提交验证 将表单的所有必填项,做一个判断函数,填写正确时返回布尔值 最后在提交时,判断每一项是否正确,全部正确才可以 提交 html <div id= ...
- 【转】Validate + Boostrap tooltip 表单验证示例
一.工具准备: 1.boostrap: 下载地址 http://getbootstrap.com/ jquery: jQuery版本需大于或等于1.8.0 jquery.validate.min.j ...
- MVC身份验证.MVC过滤器.MVC6关键字Task,Async.前端模拟表单验证,提交.自定义匿名集合.Edge导出到Excel.BootstrapTree树状菜单的全选和反选.bootstrap可搜索可多选可全选下拉框
1.MVC身份验证. 有两种方式.一个是传统的所有控制器继承自定义Control,然后再里面用MVC的过滤器拦截.所以每次网站的后台被访问时.就会先走入拦截器.进行前端和后端的验证 一个是利用(MVC ...
- 原生JS写表单验证提交功能
先上效果图: 表单的基础内容就是昵称判断.手机号判断.邮箱判断.身份证号码判断,这里是用到正则验证检验格式. 页面的表单写法就是一个form的提交.输入框用input来实现,输入内容用value来获取 ...
- Ajax 表单验证 实现代码
兼容: opera 9.6 + chrome 2.0 + FF 3 + IE 6 效果:一边输入一边实现验证 image 环境:ruby 1.8.6 + rails 2.1.0 + windows 核 ...
- validate+jquery+ajax表单验证
1.案例 1.1 Html form表单内容 <form class="cForm" id="cForm" method="post" ...
随机推荐
- 基于编辑距离来判断词语相似度方法(scala版)
词语相似性比较,最容易想到的就是编辑距离,也叫做Levenshtein Distance算法.在Python中是有现成的模块可以帮助做这个的,不过代码也很简单,我这边就用scala实现了一版. 编辑距 ...
- EditTable可编辑的表格
EditTable可编辑的表格 EditTable基于tabel布局的表格,表格内容单击可以编辑,编辑完毕即可显示新的内容: ESC按键可以撤销编辑,返回原有内容. 点击"添加& ...
- Javascript一句代码实现JS字符串去除重复字符
需求: 原字符串:abcdabecd 去重后字符串:abcde JS字符串去重,一个简单需求,网上找案例发现都是一大堆代码,对于强迫症的我 实再无法忍受,于是自己手动写出一段代码,完美解决该问题. 代 ...
- yum部署、使用 zabbix监控 - 详细过程
yum部署zabbix监控 第1章 yum部署zabbix服务端... 1 1.1 命令行部署... 1 1.1.1 yum源配置-解释... 2 1.1.2 MariaDB 与 mysql 3 1. ...
- Java学习笔记10(面向对象三:接口)
接口: 暂时可以理解为是一种特殊的抽象类 接口是功能的集合,可以看作是一种数据类型,是比抽象类更抽象的"类" 接口只描述所应该具备的方法,并没有具体实现,具体实现由接口的实现类(相 ...
- LAMP源码安装,搭建zabbix监控
#LAMP#httpd-2.2.32#mysql-5.7.17-linux-glibc2.5-x86_64 二进制压缩版#php5.3.27 1.系统环境优化检查 sed -i 's/SELINUX= ...
- 【01背包】洛谷P1282多米诺骨牌
题目描述 多米诺骨牌有上下2个方块组成,每个方块中有1~6个点.现有排成行的 上方块中点数之和记为S1,下方块中点数之和记为S2,它们的差为|S1-S2|.例如在图8-1中,S1=6+1+1+1=9, ...
- chrome调试工具高级不完整使用指南(实战二)
3.3 给页面添加测试脚本 在现实的工作中,我们往往会遇到一些问题在线上就会触发然后本地就触发不了的问题.或者是,要给某个元素写一个测试脚本.这个时候如果是浏览器有提供一个添加脚本的功能的话,那么我们 ...
- (4程序框架)从零开始的嵌入式图像图像处理(PI+QT+OpenCV)实战演练
从零开始的嵌入式图像图像处理(PI+QT+OpenCV)实战演练 1综述http://www.cnblogs.com/jsxyhelu/p/7907241.html2环境架设http://www.cn ...
- keynote 代码高亮
brew install highlight (同时会安装 Lua 和 Boost) highlight -K 18 -s Vampire -u 'utf-8' -O rtf test.html | ...