使用ASP.Net webforms进行验证.
默认情况下,ASP.Net在根级别添加表单.这意味着我们只需要在表单中添加所有控件.
但是我需要定义需要验证的页面的一小部分,我使用了jQuery验证插件.
<html>
<body>
<form method="post" action="AssetDetails.aspx" id="Form1" enctype="multipart/form-
data">
//Other page content goes here. which doesnt require validation
<form class="form-horizontal" id="validation-form" method="get">
<div class="row-fluid">
<div class="widget-header header-color-blue2">
<h5>
Step 1</h5>
</div>
<input type="email" name="ctl00$MainContent$AssetTabs$DefineCriticality$email" id="email" class="span6" />
</div>
</form>
</form>
</body></html>
使用Javascript
$(document).ready(function(){
alert($('#validation-form').length); // gives 0,because this form nested under
another form generated by ASP.Net
$('#validation-form').validate({
errorElement: 'span',errorClass: 'help-inline',focusInvalid: false,rules: {
email: {
required: true,email: true
}},messages: {
email: {
required: "Please provide a valid email.",email: "Please provide a valid email."
}},errorPlacement: function (error,element) {
error.insertAfter(element);
}
});
});
但问题是,我收到错误这个[0]在jquery验证文件中是未定义的.我发现在DOM中找不到#validation-form,因为这个表单位于那个愚蠢的ASP.Net生成的根(父)元素中.
我们该如何处理？
编辑：得到一些解决方法：
最后,我使用父表单进行了此工作,并根据字段名称添加规则. ASP.Net webform再一次通过不同方式生成控件名字段来开始给出麻烦.
这是围绕代码的工作.
var validationParams = {
errorElement: 'span',rules: {},messages: {},invalidHandler: function (event,validator) {
$('.alert-error',$('.login-form')).show();
},highlight: function (e) {
$(e).closest('.control-group').removeClass('info').addClass('error');
},success: function (e) {
$(e).closest('.control-group').removeClass('error').addClass('info');
$(e).remove();
},element) {
error.insertAfter(element);
},submitHandler: function (form) {
},invalidHandler: function (form) {
}
};
var emailFieldName = $('#email').attr('name');
validationParams['rules'][emailFieldName] = { required: true };
validationParams['messages'][emailFieldName] = { required: "Email is required" };
$('#Form1').validate(validationParams);
有没有其他更好的方法呢？
解决方法
我没有告诉你其他选项,但你问的是,你是否可以使用没有表单的验证插件.
您绝对需要< form>< / form> jQuery Validate插件的标签可以正常运行,或者根本没有.
如果你使用ajax,你必须[把你的ajax放在jQuery Validate插件的submitHandler中
您可以删除或阻止该操作,仍然使用jQuery Validate.
您可以在submitHandler中放置ajax和return false,并且不会定期提交：
$(document).ready(function() {
$('#myform').validate({ // initialize plugin
// your rules & options,submitHandler: function(form) {
// your ajax would go here
return false; // blocks regular submit since you have ajax
}
});
});
