弹出框页面中使用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");
至此,大功搞成,各位园友,有更好办法,欢迎交流。
弹出框页面中使用jquery.validate验证控件的更多相关文章
- Vue父组件如何调用子组件(弹出框)中的方法的问题
如果子组件是一个弹出框,只有在触发某个点击事件时弹出框才能出现(也就是说在父组件中的子组件使用上用了v-if),那在父组件上如果不点击弹出框是不能获取到$ref的. 原因就是:引用指向的是子组件创建的 ...
- 使用Uploadify 时,同时使用了jQuery.Validition 验证控件时,在IE11上出现JS缺少对象错误。
场景: 使用jQuery.1.8.2 使用 Uploadify 3.2上传控件 使用jQuery.Validition 1.9 验证 使用IE 11 时,当鼠标点击上传按钮时,会出现JS 缺少对象错误 ...
- WEB页面中常见的四种控件的必须的测试
以下为常规的需求,除非需求有明确说明,如密码输入框中可以输入空格. 输入框 1. 为空,但页面中明确说明不能为空(带有星号或者只有这一个输入框),有以下两种情况: a. 不进行输入或者使其为空:焦 ...
- Jquery Validation 验证控件的使用说明
转载自:http://blog.csdn.net/huang100qi/article/details/52453970,做了一些简化及修改 下载地址:https://jqueryvalidation ...
- ASP.NET c# textbox 正则表达式 文本框只允许输入数字(验证控件RegularExpressionValidator )
<input type="text" name="test" onKeyUp="test1.value=(this.value=this.val ...
- css超简单实现div页面居中【适合做弹出框】
1.前言 现在项目中用到弹出框的话大部分都是直接用控件的.不过有控件虽方便,但有时候会有冲突的地方.我上次用layui的弹出框控件,然后也用到了百度的编辑器uEditor,然后一切都好好的,结果编辑赋 ...
- [Js插件]使用JqueryUI的弹出框做一个“炫”的登录页面
引言 查看项目代码的时候,发现项目中用到JqueryUi的弹出框,可拖拽,可设置模式对话框,就想着使用它弄一个登录页面. 弹出框 在Jquery Ui官网可定制下载弹出框,下载和弹出框下载相关的js文 ...
- 使用easeui dialog弹出框中使用CKeditor多次加载后无法编辑问题
问题呈现:弹出框页面 <tr class="addtr"> <th>内容</th> <td> <!-- <textare ...
- 关于Layer弹出框初探
layer至今仍作为layui的代表作,她的受众广泛并非偶然,而是这五年多的坚持,不断完善和维护.不断建设和提升社区服务,使得猿们纷纷自发传播,乃至于成为今天的Layui最强劲的源动力.目前,laye ...
随机推荐
- iphone开发第一个UI应用程序QQ
#import <UIKit/UIKit.h> @interface HViewController : UIViewController @property (retain, nonat ...
- 关于rsync的密码问题
今天在做关于rsync的实验时,发现关于rsync的密码问题还是有几点需要注意的,因此特意归纳了一下(rsync的版本是3.1.0): 1.服务器端的密码文件的格式必须为“用户名:密码”,所属者必须为 ...
- (转)Qt Model/View 学习笔记 (三)——Model类
Model类 基本概念 在model/view构架中,model为view和delegates使用数据提供了标准接口.在Qt中,标准接口QAbstractItemModel类中被定义.不管数据在底层以 ...
- MySQL的复制原理及配置
MySQL 的数据库的高可用性的架构大概有以下几种:集群,读写分离,主备.而后面两种都是通过复制来实现的.下面将简单介绍复制的原理及配置,以及一些常见的问题. 一.复制的原理 MySQL 复制基于主服 ...
- NotifyIcon制作任务栏托盘菜单
常用软件飞信.QQ在任务栏中的图标ICO,以及鼠标移动到图标是右键菜单选项 1.首先制作任务栏图标 this.ShowInTaskbar = true; 2.窗体最小化时或者关闭时隐藏到任务栏,有时候 ...
- iOS 基础 第三天(0808)
0808 分类的使用注意 分类只可以增加方法,不可以增加成员变量 分类可以访问原来类中声明的成员变量 分类可以重新实现原来类中的方法,但是会覆盖掉原来的方法,会导致原来的方法没法再使用 方法调用的优先 ...
- ExtJs 4.2.1 点击按钮弹出表单的窗口
初学ExtJs,做项目的时候想做一个这样的效果:点击按钮弹出对话框,之前一直是使用EasyUi来做的, EasyUi里有Dialog,用起来很方便,但是现在转移到ExtJs上后,发现没有Dialog这 ...
- Windows 7下载
原版的ISO:windows 7 旗舰版:32位: ed2k://|file|cn_windows_7_ultimate_x86_dvd_x15-65907.iso|2604238848|D6F139 ...
- 1972: [Sdoi2010]猪国杀 - BZOJ
题目太长,我只发链接吧 wikioi(排版看起来舒服一点):http://www.wikioi.com/problem/1834/ bzoj:http://www.lydsy.com:808/Judg ...
- PAT-乙级-1002. 写出这个数 (20)
1002. 写出这个数 (20) 时间限制 400 ms 内存限制 65536 kB 代码长度限制 8000 B 判题程序 Standard 作者 CHEN, Yue 读入一个自然数n,计算其各位数字 ...