带有select的jquery验证程序不工作
我刚刚开始使用jQueryValidate插件,但未能按预期工作 我在小提琴上有一个例子 谁能告诉我我到底做错了什么?我只是想要求用户在下拉列表中选择一个选项,但即使我没有选择一个值,它也会说表单是有效的 HTML:带有select的jquery验证程序不工作,jquery,jquery-validate,Jquery,Jquery Validate,我刚刚开始使用jQueryValidate插件,但未能按预期工作 我在小提琴上有一个例子 谁能告诉我我到底做错了什么?我只是想要求用户在下拉列表中选择一个选项,但即使我没有选择一个值,它也会说表单是有效的 HTML: <form id="roadForm" method="get" action=""> <p> <label for="editRoad_ProjectClassification"> <em
<form id="roadForm" method="get" action="">
<p>
<label for="editRoad_ProjectClassification">
<em class="red">*</em> Project Classification:
</label>
<select id="editRoad_ProjectClassification" name="editRoad_ProjectClassification" title="Please select something!" validate="required:true">
<option value="">Please select</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</p>
</form>
<label class="FUNC_saveRecord">
<span class="icon iconSave"></span>
<span class="title">Save</span>
</label>
$('.FUNC_saveRecord').click(function() {
saveRecord();
});
function saveRecord() {
var roadFormValidator = $('#roadForm').validate();
if (!roadFormValidator.valid()) {
roadFormValidator.showErrors();
}
else {
alert('form is valid');
}
}
<form id="roadForm" method="get" action="">
<p>
<label for="editRoad_ProjectClassification">
<em class="red">*</em> Project Classification:
</label>
<select id="editRoad_ProjectClassification" name="editRoad_ProjectClassification" title="Please select something!" class="required">
<option value="">Please select</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</p>
</form>
<label class="FUNC_saveRecord">
<span class="icon iconSave"></span><span class="title">Save</span>
</label>
$("#roadForm").validate();
$('.FUNC_saveRecord').click(function() {
saveRecord();
});
function saveRecord() {
var roadFormValidator = $('#roadForm');
if (roadFormValidator.valid()) {
alert('form is valid');
}
}
这里有几个问题:
表单
在开头标记中拼写错误(
)看起来这是已修复的class='required'
属性validate=required:true
不起作用时调用验证
。只需在document.ready上调用一次即可
淋浴ROR
。插件将自动为您执行此操作<form id="roadForm" method="get" action="">
<p>
<label for="editRoad_ProjectClassification">
<em class="red">*</em> Project Classification:
</label>
<select id="editRoad_ProjectClassification" name="editRoad_ProjectClassification" title="Please select something!" validate="required:true">
<option value="">Please select</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</p>
</form>
<label class="FUNC_saveRecord">
<span class="icon iconSave"></span>
<span class="title">Save</span>
</label>
$('.FUNC_saveRecord').click(function() {
saveRecord();
});
function saveRecord() {
var roadFormValidator = $('#roadForm').validate();
if (!roadFormValidator.valid()) {
roadFormValidator.showErrors();
}
else {
alert('form is valid');
}
}
<form id="roadForm" method="get" action="">
<p>
<label for="editRoad_ProjectClassification">
<em class="red">*</em> Project Classification:
</label>
<select id="editRoad_ProjectClassification" name="editRoad_ProjectClassification" title="Please select something!" class="required">
<option value="">Please select</option>
<option value="1">1</option>
<option value="2">2</option>
</select>
</p>
</form>
<label class="FUNC_saveRecord">
<span class="icon iconSave"></span><span class="title">Save</span>
</label>
$("#roadForm").validate();
$('.FUNC_saveRecord').click(function() {
saveRecord();
});
function saveRecord() {
var roadFormValidator = $('#roadForm');
if (roadFormValidator.valid()) {
alert('form is valid');
}
}
更新示例: