bootstrap的验证和确认对话框
生活随笔
收集整理的這篇文章主要介紹了
bootstrap的验证和确认对话框
小編覺(jué)得挺不錯(cuò)的,現(xiàn)在分享給大家,幫大家做個(gè)參考.
?
BootstrapValidator: http://bv.doc.javake.cn/api/
?
引用
<!-- jquery-confirm.確認(rèn)對(duì)話框 --> <link href="~/assets/dist/css/jquery-confirm.min.css" rel="stylesheet" /> <script src="~/assets/dist/js/jquery-confirm.min.js"></script><!-- bootstrapValidator.驗(yàn)證 --> <link href="~/assets/dist/css/bootstrapValidator.min.css" rel="stylesheet" /> <script src="~/assets/dist/js/bootstrapValidator.js"></script>?
?
JS
<script>$('#formMenu').bootstrapValidator({message: 'This value is not valid',feedbackIcons: {valid: 'glyphicon glyphicon-ok',invalid: 'glyphicon glyphicon-remove',validating: 'glyphicon glyphicon-refresh'},fields: {username: {message: 'The username is not valid',validators: {notEmpty: {message: 'The username is required and cannot be empty'},stringLength: {min: 6,max: 30,message: 'The username must be more than 6 and less than 30 characters long'},regexp: {regexp: /^[a-zA-Z0-9_]+$/,message: 'The username can only consist of alphabetical, number and underscore'}}},email: {validators: {notEmpty: {message: 'The email is required and cannot be empty'},emailAddress: {message: 'The input is not a valid email address'}}},}}).on('success.form.bv', function (e) {//驗(yàn)證成功 $.confirm({confirmButtonClass: 'btn-info',cancelButtonClass: 'btn-danger',title: '保存',content: '請(qǐng)確認(rèn),是否保存?',confirm: function () {$.ajax({url: "/Menu/save",type: "post",data: $('#formMenu').serialize(),success: function (data) {$("#myModal").modal("hide");tables.ajax.reload(null, false);}});this.close();},});});//保存 $('#save').on('click', function () {//開(kāi)啟驗(yàn)證 $('#formMenu').bootstrapValidator('validate');}) </script>總結(jié)
以上是生活随笔為你收集整理的bootstrap的验证和确认对话框的全部?jī)?nèi)容,希望文章能夠幫你解決所遇到的問(wèn)題。
- 上一篇: ASP.NET验证控件
- 下一篇: “达克效应”让人们信心满满还是畏惧不前?