读书人

jquery-validate的有关问题

发布时间: 2012-08-29 08:40:14 作者: rapoo

jquery-validate的问题
我想要验证培训名称和培训周期,我就能写到这了,不好使,再往后不了,还应该怎么写才对,在textfield后面显示错误信息,要红色的字

JScript code
<%@ page language="java" contentType="text/html; charset=UTF-8"    pageEncoding="UTF-8"%><%@taglib uri="/struts-tags"  prefix="s"%><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head>    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />    <title>培训类型管理</title>    <script type="text/javascript" src="../commons/js/global.js"></script>    <script type="text/javascript" src="../commons/widget/jquery/jquery.js"></script>    <script type="text/javascript" src="../commons/widget/jquery/jquery.validate.pack.js"></script>    <script type="text/javascript">    $(document).ready(function(){        $("#trainTypeForm").validate({            rules:{                "trainType.trainTypeName":{                    required:true                },                "trainType.trainPeriod":{                    required:true,                    number:true                }            },            messages:{                "trainType.trainTypeName":{                    required:"填写培训类型名称!"                }                "trainType.trainPeriod":{                    required:"填写培训周期!",                    number:"培训周期必须为数字"                },            },                        focusInvalid:true,            onkeyup:true,                        errorPlacement: function(error, element) {                  error.appendTo( element.parent());                  }                          });    });    </script></head><body>    <link rel="stylesheet" type="text/css" href="../commons/css/css.css"></link>        <s:form id="trainTypeForm" name="trainTypeForm" method="post">    <s:hidden name="trainType.trainTypeId" id="trainTypeId"/>        <table width="600" align="center" border="0" cellpadding="0"            cellspacing="0" bgcolor="#666699">            <tr>                <td>                    <table width="100%" border="0" cellspacing="1" cellpadding="0"                        class="style2">                        <tr bgcolor="#f3f7ff" height="24">                            <td width="15%" bgcolor="#E0ECF8" align="center">                                培训类型名称:                            </td>                            <td width="35%">                                                                 <s:textfield name="trainType.trainTypeName" id="trainType.trainTypeName"></s:textfield>                                                </td>                            <td width="15%" bgcolor="#E0ECF8" align="center">                                上级培训类型:                            </td>                            <td width="35%">                                 ${upTrainTypeName}<s:hidden name="trainType.upTrainTypeId" id="upTrainTypeId"></s:hidden>                            </td>                        </tr>                        <tr bgcolor="#f3f7ff" height="24">                            <td width="12%" bgcolor="#E0ECF8" align="center">                                培训周期:                            </td>                            <td width="40%">                                                                 <s:textfield name="trainType.trainPeriod" id="trainType.trainPeriod"></s:textfield>                                                        </td>                            <td width="12%" bgcolor="#E0ECF8" align="center">                                                             </td>                            <td width="36%">                                                             </td>                        </tr>                    </table>                    <table width="100%" border="0" cellspacing="1" cellpadding="0"                        bgcolor="#FFFFFF">                        <tr align="center">                            <td>                                <s:submit value="修改" method="update"/>                                                                 <s:submit value="新增同级" method="addSame"/>                                                                 <s:submit value="新增下级" method="addLow"/>                                                                                             <s:submit value="删除" method="remove"/>                                </td>                        </tr>                    </table>                </td>            </tr>        </table></s:form></body> 



[解决办法]
var attribute = {
rules:{
"entity.name": {
required:true,
minlength:2,
remote: {url:"questionnaire/json_companyBranch_jsonCheckName.do",
data:{
"entity.uid":function(){return $("#id").val();},
"entity.name":function(){return $("#name").val();},
"entity.companyUid":function(){return $("#companyUid", window.parent.document).val();}
}}
},
"entity.code": {
required:true,
minlength:2,
remote:{url:"questionnaire/json_companyBranch_jsonCheckCode.do",
data:{
"entity.uid":function(){return $("#id").val();},
"entity.code":function(){return $("#code").val();},
"entity.companyUid":function(){return $("#companyUid", window.parent.document).val();}
}}
}
},
messages:{
"entity.name": {
required:"名称不能为空!",
minlength:jQuery.format("最少输入{0}字符或汉字"),
remote: "名称已存在,请重新输入!"
},
"entity.code": {
required:"代码不能为空!",
minlength:jQuery.format("最少输入{0}字符或汉字"),
remote: "代码已存在,请重新输入!"
}
},
errorPlacement: function(error, element) {
if (element.next().size()==0) {
error.appendTo(element.parent());
} else {
error.appendTo(element.next());
}
},
submitHandler: function() {
process();
},
// set this class to error-labels to indicate valid fields
success: function(label) {
// set   as text for IE
label.html(" ").addClass("checked");
}
};

function process() {
var url = "questionnaire/json_companyBranch_jsonSave.do";

$.getJSON(url,
{"ran":Math.random(),
"entity.name":$("#name").val(),
"entity.code":$("#code").val(),
"entity.companyUid":$("#companyUid", window.parent.document).val(),
"entity.uid":$("#id").val()
}, function(data){
var r = eval("("+(""+data).replace(/\r\n|\r|\n/g,"")+")");
r.status ? parent.closeDialog(r.message) : showSimpleMessage(r.message);
});
}

$(document).ready(function () {
var validator = $("#form1").validate(attribute);
//var message = $("#message").val();
});

读书人网 >JavaScript

热点推荐