我在验证表单时遇到问题。当我将所有字段/textarea 的空白保留在最后一个字段之外时,我的表单对提交操作没有任何作用......当我只有一个 textfield/textarea 需要验证时,也会发生这种情况。我不知道这是怎么可能的,因为当我注销我的错误时,它会显示所有应该显示的错误,但它不会添加到页面本身。这是我的代码:
1) JQuery 代码(这是在$(document).ready(function(ev){ initialiseValidation() });
function initialiseValidation()
{
$('form').each(function()
{
var validators = [];
var form = $(this);
var textfields = form.find("input[type]").not("input[type=submit]");
var textareas = form.find("textarea");
var formfields = $.merge(textfields, textareas);
formfields.each(function()
{
var inputfield = $(this);
var field = inputfield.find('[name=' + inputfield.attr('name') + ']');
var type = inputfield.attr('type') == undefined ? 'textarea' : inputfield.attr('type');
var label = inputfield.attr("name");
function hide_feedback(message)
{
$('.errormessages').remove();
}
function show_feedback(message){
// Insert own error message
$(".formulier").before($('<ul/>').addClass('errormessages contact').append($('<li/>').text(message)));
}
if(inputfield.length)
{
if (inputfield.is("input") || inputfield.is("textarea"))
{
function validator()
{
var error = undefined;
if (!inputfield.val())
error = getMessageForLabel(label);
else if (label == 'email' && ! inputfield.val().match(/.+@.+\..+/))
error = "Gelieve een geldig e-mail adres in te geven.";
else if(label == "username" && checkUsername())
error = "Username bestaat niet.";
hide_feedback();
if (error)
{
show_feedback(error);
throw new ValidationError(label, error, function () {
field.focus();
return false;
});
}
}
// Validator for field.onchange
function quick_validate(event)
{
// Ignore tab-key
//log(event.keyCode);
if (event.keyCode != 9)
{
try {
validator();
}
catch(validation_error) {
}
}
}
inputfield.change(quick_validate).keyup(quick_validate).blur(quick_validate);
// Validator for form.submit
validators.push(validator);
}
}
});
$(this).submit(function(ev)
{
var errors = [];
// Call all validators
for (var v in validators)
{
try {
validators[v]();
}
catch(validation_error)
{
errors.push(validation_error);
}
}
if (errors.length)
{
$('.errormessages').empty();
for(var i in errors)
{
var msg = errors[i]['error_msg'];
$(".errormessages").append($('<li/>').text(msg));
}
return false;
}
});
});
}
function ValidationError(label, error_msg, ok_callback)
{
this.label = label;
this.error_msg = error_msg;
this.ok_callback = ok_callback;
}
2)HTML代码(不是最好的,所有的类都是为了让样式更好……)
<form action="index.php?page=contact&action=confirm" method="post" enctype="multipart/form-data" id="contactform">
{if !empty($errorArr)}
<ul class="errormessages contact">
{foreach $errorArr as $error}
<li>{$error}</li>
{/foreach}
</ul>
{/if}
<div class="formulier">
<div class="formblock">
<div class="label">
<label for="naam">Voornaam:</label>
</div>
<input type="text" name="naam" id="naam" autocomplete="true" value="{if isset($smarty.post.naam)}{$smarty.post.naam}{/if}"/>
</div>
</br>
<div class="formblock">
<div class="label">
<label for="familienaam">Naam:</label>
</div>
<input type="text" name="familienaam" id="familienaam" autocomplete="true" value="{if isset($smarty.post.familienaam)}{$smarty.post.familienaam}{/if}"/>
</div>
</br>
<div class="formblock">
<div class="label">
<label for="email">E-mail:</label>
</div>
<input type="text" name="email" id="email" autocomplete="true" value="{if isset($smarty.post.email)}{$smarty.post.email}{/if}"/>
</div>
</br>
<div class="formblock">
<div class="label">
<label for="bericht">Bericht:</label>
</div>
<textarea rows="10" cols="50" name="bericht" id="bericht">{if isset($smarty.post.bericht)}{$smarty.post.bericht}{/if}</textarea>
</div>
</br>
<div class="formblock">
<input type="submit" value="stuur bericht" name="validateMail" id="validateMail"/>
</div>
</div>
</form>
我在网上搜索了很多,但我找不到这个问题的解决方案,所以如果你有任何提示/解决方案,我们将不胜感激!