弹出框页面中使用jquery.validate验证控件

弹出框页面中使用jquery.validate验证控件有几个问题需要解决：

1，弹出框的提交事件完成后如何关闭弹出框页面？

2，提交不成功如何返回当前页？

3，如果知道验证事件成功？

之前笔者都是JS验证控件，放着强大的jquery.validate控件不用，自己写验证，会是让追求程序完美的人心里有种淡淡的忧伤。

不过还好，今天下午笔者花了点时间，已实现这种功能，虽然也不是很完美，但也基本能用了。

先看下效果，一会再上代码。

当验证通过后，程序后台开始提交，提交成功，当前弹出框关闭。

为此代码如下。

1，打开弹出框。

        function AnswerDialog(id) {$.dialog({width: '450px',height: '500px',lock: true, title: '回复提问',content: 'url:/VideoManage/QuestionEdit/' + id});}

2，在弹出框中定义关闭事件。

        var api = frameElement.api, W = api.opener;var data = api.data;

3，验证成功开始执行自定义代码。

        $(document).ready(function () {$("#formLogin").validate({event: "keyup",success: function () {ok },rules: {VideoTitle: { required: true },Answer: { required: true }},messages: {VideoTitle: { required: '不能为空!' },Answer: { required: '不能为空!' }}});});

4，在ok方法中提交数据库，如果返回结果正确，关闭当前弹出框。

        function ok() {var questionId = $('#QuestionId').val();var answer = $('#Answer').val();            var isPublic = $('input:radio[name="IsPublic"]:checked').val();$.post("/VideoManage/QuestionEditPost", { questionId: questionId, answer: answer, isPublic: isPublic }, function (txt) {if (txt == "OK") {api.close();}                }, "text");           }

5，如果返回结果不正确，页面不会关闭，这时执行后台传过来的页面提示框，并跳转。

return Content("<script>alert('新增失败，请稍后重试！');window.history.go(-1);</script>", "text/html");

至此，大功搞成，各位园友，有更好办法，欢迎交流。

转载于:https://www.cnblogs.com/ushou/p/3345966.html

弹出框页面中使用jquery.validate验证控件相关推荐

aspx隐藏前台控件div_c# – 代码隐藏页面无法“查看”aspx页面中声明的任何项目/控件...
这是我的Default.aspx页面(删除了不必要的细节): Username Password 这是代码隐藏(删除了不必要的细节): namespace webapp { public partia ...
android 弹出输入法软键盘挤压屏幕或挤压控件问题
话不多说,直接上解决方法. 在AndroidManifest.xml activity 里面加上android:windowSoftInputMode="adjustPan|stateHid ...
登陆页老是提示验证码错误，validate验证控件IE下用remote方法明明返回true 但是还是报错,提示验证码错误...
登陆页后台:login.php <?php /** * 前台登录退出操作 * */ defined('IN_B2B2C') or exit('Access Invalid!'); header ...
artDialog弹出新页面，保存后关闭弹出框并刷新父页面
artDialog 弹出框插件,或者说是弹出对话框插件,需要对弹出后的对话框操作?artDialog的控制接口就是用来干这些事情的,这在异步消息操作中非常有用. artDialog功能特性: 自适应内 ...
[Js插件]使用JqueryUI的弹出框做一个“炫”的登录页面
引言查看项目代码的时候,发现项目中用到JqueryUi的弹出框,可拖拽,可设置模式对话框,就想着使用它弄一个登录页面. 弹出框在Jquery Ui官网可定制下载弹出框,下载和弹出框下载相关的js文 ...
jQuery+Bootstrap美化弹出框
项目中很多弹出的警告框是通过alert()弹出的浏览器警告框,样式比较丑陋且和页面使用的Bootstrap框架样式不吻合,因此需要修改弹出框样式. 采用jQuery+Bootstrap的方式这样弹出的 ...
使用easeui dialog弹出框中使用CKeditor多次加载后无法编辑问题
问题呈现:弹出框页面 <tr class="addtr"><th>内容</th><td><!-- <textarea r ...
clipboard.js在弹出框中无法复制的问题
前几天发现了个bug,在jquery-ui的弹出框(dialog)中,使用clipboard.js实现的复制功能,竟然不会生效,后面查了下相关资料,发现不止jquery-ui的dialog不行,其他的 ...
Java程序员从笨鸟到菜鸟之（三十）javascript弹出框、事件、对象化编程
一:弹出框 JavaScript中有三种弹出框:警告(alert).确认(confirm)以及提问(prompt). 1.警告(alert) 在访问网站的时候,你遇到"咚"的一声 ...

弹出框页面中使用jquery.validate验证控件

弹出框页面中使用jquery.validate验证控件相关推荐

最新文章

热门文章