ASP.Net WebForms和验证 [英] ASP.Net Webforms and Validation
问题描述
我有我希望使用表单验证io的jQuery插件来执行客户端验证一个asp.net web应用程序。
I have a asp.net web application that I wish to use form validation io jquery plugin to perform client side validation.
我的格式设置和插件正在验证领域，因为它们被改变，但是如果其中一个字段被验证它可以让即使我有空必填字段提交表单的其余部分。
I have the form set up and the plugin is validating the fields as they are changed, however if one of the fields is validated it allows the rest of the form to be submitted even though I have empty required fields.
asp.net Web窗体页：
asp.net Web form page:
<%@ Page Title="" Language="VB" MasterPageFile="~/MasterPage.master" AutoEventWireup="false" CodeFile="NewUser.aspx.vb" Inherits="NewUser" ClientIDMode="Static" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
<link href="Layout/formvalidation/css/formValidation.min.css" rel="stylesheet" />
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<div class="row" id="NewUserForm" role="form">
<h1 class="col-xs-12">New User Form:</h1>
<div class="form-group">
<label class="control-label col-sm-2" for="<%= UsernameText.UniqueID %>">Username:</label>
<div class="col-sm-10">
<asp:TextBox runat="server" ID="UsernameText" CssClass="form-control" placeholder="Username" />
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="<%= EmailText.UniqueID %>">Email:</label>
<div class="col-sm-10">
<asp:TextBox runat="server" ID="EmailText" CssClass="form-control" TextMode="Email" Type="email" placeholder="Ëmail address"/>
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="<%= PasswordText.UniqueID %>">Password:</label>
<div class="col-sm-10">
<asp:TextBox runat="server" ID="PasswordText" CssClass="form-control" TextMode="Password" placeholder="Password" />
</div>
</div>
<div class="form-group">
<label class="control-label col-sm-2" for="<%= ConfirmPasswordText.UniqueID %>">Confirm Password:</label>
<div class="col-sm-10">
<asp:TextBox runat="server" ID="ConfirmPasswordText" CssClass="form-control" TextMode="Password" placeholder="Confirm password" />
</div>
</div>
<asp:LinkButton ID="LinkButton1" runat="server" Text="Button" CssClass="btn btn-primary disabled" type="submit" />
</div>
<br />
<div class="row">
<div class="col-xs-12">
<asp:LinkButton runat="server" ID="CreateUserButton" text="Create User" CssClass="btn btn-info" />
</div>
</div>
<script src="Layout/formvalidation/js/formValidation.min.js"></script>
<script src="Layout/formvalidation/js/framework/bootstrap.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
$('#NewUserForm').formValidation({
framework: 'bootstrap',
icon: {
valid: 'glyphicon glyphicon-ok',
invalid: 'glyphicon glyphicon-remove',
validating: 'glyphicon glyphicon-refresh'
},
fields: {
// There is no single quote
<%=UsernameText.UniqueID%>: {
validators: {
notEmpty: {
message: 'The username is required and cannot be empty'
},
different: {
field: '<%=PasswordText.uniqueID%>',
message: 'The username and password cannot be the same as each other'
}
}
},
<%=EmailText.UniqueID%>: {
validators:{
notEmpty: {
Message: 'The email field is required and cannot be empty'
},
email: {
Message: 'Please enter a valid email address!'
}
}
},
<%=PasswordText.uniqueID%>: {
validators:{
notEmpty: {
Message: 'A password is required and cannot be empty'
},
stringLength: {
min: 7,
max: 30,
message: 'The password must be more than 7 and less than 30 characters long'
},
regexp: {
regexp: /^(?=.*?[A-Z])(?=.*?[a-z])(?=.*?[0-9])(?=.*?[#?!@$%^&*-]).{8,}$/,
message: 'Password must contain at least 1 uppercase, 1 lowercase, 1 number and 1 special character'
},
identical: {
field: '<%=ConfirmPasswordText.UniqueID%>',
message: 'Passwords do not match'
}
}
},
<%= ConfirmPasswordText.UniqueID%>:{
validators:{
identical: {
field: '<%=PasswordText.UniqueID%>',
message: 'Passwords do not match'
}
}
}
}
});
});
</script>
任何建议，我怎么能获取页面之前验证所有控件提交 - 如果有任何从提交验证失败，以prevent形式。
Any suggestions as to how I can get the page to validate all controls before submit - and if there are any failed validation to prevent the form from submitting.
即时通讯使用这个插件是： http://formvalidation.io/
The plugin Im using is : http://formvalidation.io/
推荐答案
的<一个href=\"https://msdn.microsoft.com/en-us/library/system.web.ui.webcontrols.linkbutton.onclientclick(v=vs.110).aspx\"相对=nofollow> OnClientClick属性是什么您这里需要。将它添加到您的提交按钮，并指定一个JavaScript函数，请问您验证表单。如果这个函数返回真正，表单将提交正常，如果假，提交将被阻止。
The OnClientClick property is what you need here. Add it to your submit button and specify a Javascript function which does your validate form. If this function returns true, the form will submit as normal, if false, the submit will be blocked.
在你的情况与formvalidation.io（从API文档），你会做这样的事
In your case with formvalidation.io (from the API docs), you'd do something like this:
<asp:LinkButton runat="server" ID="CreateUserButton" text="Create User" CssClass="btn btn-info" OnClientClick="return isValidClient()" />
...
<script type="text/javascript">
function isValidClient() {
return $('#NewUserForm').data('formValidation').validate().isValid();
}
</script>
这里最重要的是要确保你有收益中的功能和属性的OnClientClick都 - 它不会工作，否则
The most important thing here is to make sure you have return in both the function and the OnClientClick attribute - it won't work otherwise!
这篇关于ASP.Net WebForms和验证的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
