选择带有消息的jquery验证 [英] jquery validation on select with message
问题描述
当某人尝试提交选择仍显示请选择时区"的地方时，我想在选择语句上添加验证:
< form id ="timezoneform" action =<?php echo htmlentities($ _ SERVER ['REQUEST_URI']);?>"method ="POST"><选择name ="DropDownTimezone" id ="DropDownTimezone" class ="required">< option selected =" name ="timezone_selector" value =" style ="font-style:italic">请选择时区</option>< option value =太平洋/中途岛">太平洋/中途岛(GMT -11:00)</option>....</select><输入type ="submit" id ="changetimezone" name ="changetimezone" value =更改时区"/></form> 我试图提供与文本框相同的验证，但我想这是不一样的:
< head>< script language ="javascript" type ="text/javascript" src ="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script><脚本语言="javascript" type ="text/javascript" src ="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>< script type ="text/javascript">var js = jQuery.noConflict();js(#changetimezone").click(function(){js(#timezoneform").validate({规则:{timezone_selector:{必填:true}}，讯息:{timezone_selector:{必填:您必须选择时区"}}});});</script></head> 如何使选择语句显示类似的消息，就像 validate()对文本框所做的那样.我看过这样的帖子，但我仍然没有运气.预先感谢.
您的表单需要一些调整:
< form id ="timezoneform" action =<?php echo htmlentities($ _ SERVER ['REQUEST_URI']);?>"method ="POST"><选择name ="DropDownTimezone" id ="DropDownTimezone">< option selected =" name ="timezone_selector" value =" style ="font-style:italic">请选择时区</option>< option value =太平洋/中途岛">太平洋/中途岛(GMT -11:00)</option>....</select><输入type ="submit" id ="changetimezone" name ="changetimezone" value =更改时区"/></form> 请特别注意:
-
option元素不应具有name属性，并且validate插件不应以option为目标元素. -
如果您要在JavaScript中定义规则，则在
select上也不需要class ='required'. -
最后，您不需要在
click处理程序中调用validate.您可以在表单准备好后立即对其进行定义(js(document).ready(function(){...});).
总结:
var js = jQuery.noConflict();js(document).ready(function(){js(#timezoneform").validate({规则:{DropDownTimezone:{必填:true}}，讯息:{DropDownTimezone:{必填:您必须选择时区"}}});}); 示例: http://jsfiddle.net/ALUQB/
I want to add validation on a select statement when someone tries to submit where the select still shows "Please select a timezone":
<form id="timezoneform" action="<?php echo htmlentities($_SERVER['REQUEST_URI']); ?>" method="POST">
<select name="DropDownTimezone" id="DropDownTimezone" class="required">
<option selected="" name="timezone_selector" value="" style="font-style:italic">Please select a timezone</option>
<option value="Pacific/Midway">Pacific/Midway (GMT -11:00)</option>
....
</select>
<input type="submit" id="changetimezone" name="changetimezone" value="Change timezone" />
</form>
I tried to provide the same validation that I use for text boxes but I guess it's not the same:
<head>
<script language="javascript" type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.js"></script>
<script language="javascript" type="text/javascript" src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.8.1/jquery.validate.min.js"></script>
<script type="text/javascript">
var js = jQuery.noConflict();
js("#changetimezone").click(function() {
js("#timezoneform").validate({
rules: {
timezone_selector: {
required: true
}
},
messages: {
timezone_selector: {
required: "You must select a timezone"
}
}
});
});
</script>
</head>
How can I get a similar message to appear for select statements as validate() does for text boxes. I've seen posts like this but I'm still having no luck. Thanks in advance.
Your form need a few tweaks:
<form id="timezoneform" action="<?php echo htmlentities($_SERVER['REQUEST_URI']); ?>" method="POST">
<select name="DropDownTimezone" id="DropDownTimezone">
<option selected="" name="timezone_selector" value="" style="font-style:italic">Please select a timezone</option>
<option value="Pacific/Midway">Pacific/Midway (GMT -11:00)</option>
....
</select>
<input type="submit" id="changetimezone" name="changetimezone" value="Change timezone" />
</form>
Note specifically that:
the
optionelement should not have anameattribute, and thevalidateplugin should not be targeting theoptionelement.You also don't need
class='required'on theselectif you're going to define the rule in your JavaScript.Finally, you don't need to call
validateinside aclickhandler. You can define it as soon as the form is ready (js(document).ready(function () { ... });).
In summary:
var js = jQuery.noConflict();
js(document).ready(function() {
js("#timezoneform").validate({
rules: {
DropDownTimezone: {
required: true
}
},
messages: {
DropDownTimezone: {
required: "You must select a timezone"
}
}
});
});
Example: http://jsfiddle.net/ALUQB/
这篇关于选择带有消息的jquery验证的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
