iview 表单验证

<modal v-model="modelPassWord" width="520" title="修改密码"
		:mask-closable="false"> <i-form :label-width="100"
		ref=‘formItemP‘ :model="formItemP" :rules=‘ruleValidateP‘> <form-item
		label="请输入旧密码" prop="oldPwd"> <i-input
		placeholder="请输入旧密码" v-model="formItemP.oldPwd" name=""></i-input> </form-item> <form-item
		label="请输入新密码" prop="newPwd"> <i-input
		placeholder="请输入新密码" v-model="formItemP.newPwd"></i-input> </form-item> <form-item
		label="重新输入密码" prop="repeatPwd"> <i-input
		placeholder="重新输入密码" v-model="formItemP.repeatPwd"></i-input> </form-item> </i-form>
	<div slot="footer">
		<i-button type="ghost" @click="pwdModelCancel">取消</i-button>
		<i-button type="error" @click="pwdModelOk(‘formItemP‘)">确定</i-button>
	</div>
	</modal>

  

	//修改密码验证
			formItemP: {
				oldPwd: "",
				newPwd: "",
				repeatPwd: ""
			},
			ruleValidateP: {
				oldPwd: [{
					required: true,
					message: ‘请输入旧密码‘,
					trigger: ‘blur‘
				}],
				newPwd: [{
					required: true,
					message: ‘请输入新密码‘,
					trigger: ‘blur‘
				}],
				repeatPwd: [{
					required: true,
					trigger: ‘blur‘,
					validator:function(rule, value, callback){
	                    if (value == ‘‘) {
	                        return callback(new Error(‘请再次输入密码‘));
	                    } else if (value != logoApp.formItemP.newPwd) {
	                        return callback(new Error(‘两次密码不一致‘));
	                    } else {
	                        callback();
	                    }
	                }
				}]
			}

		}

  

原文地址:https://www.cnblogs.com/lgjc/p/9220318.html

时间: 2024-09-30 13:41:08

iview 表单验证的相关文章

iview表单验证--数字必填+校验

直接使用: { required: true, type:"integer", message:"请填写整数", trigger: "blur" } 毛线都不管用. 非得自定义验证才可以: validateTest = (rule, value, callback) => { if (/^[0-9]+$/.test(value)) { callback(); } else { return callback(new Error("

iview 表单验证及验证重置 阿星小栈

this.$refs[name].validate((valid) => { if (valid) { this.$Message.success('Success!'); } else { this.$Message.error('Fail!'); } }) //重置 this.$refs[name].resetFields(); 原文地址:https://www.cnblogs.com/dereckbu/p/8777997.html

iview中Modal弹窗做form表单验证相关问题

在modal中初始化状态,点击确定弹窗消失. 有的时候表单验证就不希望立刻消失 在iview官网中有自定义页头页脚 可以直接自定义使用 如果报错 validate 未定义的话,需要看一下点击事件内容引号是否正确 原文地址:https://www.cnblogs.com/xu-nian-qin/p/10824736.html

iview 表单相关

view表单验证的步骤: 第一步:给 Form 设置属性 rules :rules第二步:同时给需要验证的每个 FormItem 设置属性 prop 指向对应字段即可 prop=""第三步:注意:Form标签里面是 :model第四步:注意:在Form标签里面必须添加 ref,相当于id,在此范围内的表单验证有效第五步:在操作保存按钮时,添加方法,对整个表单进行校验,参数为检验完的回调,会返回一个 Boolean 表示成功与失败--------------------- <For

Iview 表单提交: Cannot read property &#39;validate&#39; of undefined

提交表单时,提示报这个错,找了半天,然后也百度了很久,一直没找到答案,代码如下: <link href="~/lib/iview3.1.4/styles/iview.css" rel="stylesheet" /> <link href="~/css/login.css" rel="stylesheet" /> <link href="~/lib/iview3.1.4/styles/iv

python :表单验证--对每一个输入框进行验证

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html> <head> <meta charset="UTF-8"/> <title>Title</title> <style> .error{ color

jquery插件,表单验证validation plugin的使用

笔记: 一.首先引入插件 <script type="text/javascript" src="js/jquery-1.10.0.js" ></script> <script type="text/javascript" src="js/jquery.validate-1.13.1.js" ></script> 列子:一个简单的登录表单验证 1 <form id=&quo

AngularJs 表单验证

看到一些博客说这个框架要过时了,但是还是学习了下,觉的很方便的一个框架,有空的同学可以看看,适合我们入门看,比较基础. 对于日常的开发来说,最常见的开发场景就是通过表单编辑数据,这里涉及的问题就是验证问题. angularjs 内置已经支持了常见的验证方式,可以轻松实现表单验证. 1. 绑定 为了方便,我们在 $scope 上下文对象上创建一个 model 来表示我们编辑的内容. $scope.model = { id : 8, name: "alice", email: "

表单验证&amp;lt;AngularJs&amp;gt;

经常使用的表单验证指令 1. 必填项验证 某个表单输入是否已填写,仅仅要在输入字段元素上加入HTML5标记required就可以: <input type="text" required />   2. 最小长度 验证表单输入的文本长度是否大于某个最小值,在输入字段上使用指令ng-minleng= "{number}": <input type="text" ng-minlength="5" /> 3.