如何使电子邮件地址同时需要和验证?
问题描述:
我试图验证并要求从文本框的电子邮件地址中的字段,但我不能使用RequiredFieldValidator
和RequiredExpressionValidator
,因为它们不起作用。如何使电子邮件地址同时需要和验证?
我有一个脚本,如果用户没有在文本框中输入内容,它将要求用户输入一些文本,它会变为红色的文本框,如果用户之后输入文本,它会得到绿色。但问题是他变绿,并且不显示我的消息,即电子邮件地址的格式无效。
ASP.NET:
<FooterTemplate>
<asp:TextBox ID="txtbemail" runat="server"/>
<asp:RegularExpressionValidator ID="regexEmailValid" runat="server" ValidationExpression="\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ControlToValidate="txtbemail">
<asp:RequiredFieldValidator ID="RequiredFieldValidator2" ControlToValidate = "txtbemail"
runat="server" ErrorMessage="*Necessário preencher"/>
</asp:RegularExpressionValidator>
<asp:LinkButton ID="LinkButton1" CommandName="AddNew" runat="server" CssClass="btn btn-large btn-info pull-right">
<i class="glyphicon glyphicon-plus"></i> Adicionar
</asp:LinkButton>
</FooterTemplate>
的JavaScript:
01:<script type="text/javascript">
//Define o intervalo para verificar os validadores
setInterval(function() { colorBorders() }, 100);
function colorBorders() {
if (typeof (Page_Validators) !== 'undefined') {
//Faz um loop para verificar os validadores
for (var i = 0; i < Page_Validators.length; i++) {
var validator = Page_Validators[i];
var control = document.getElementById(validator.controltovalidate);
//Verifica se o controle existe
if (control != null) {
// se o validador não for válido, coloque a borda vermelha, se for válida retornar à cor padrão
// elseif com a cor do rgb é necessário para impedir o desdobramento do cromo piscar
if (!validator.isvalid) {
control.style.borderColor = '#ff0000';
} else if (control.style.borderColor == "rgb(255, 0, 0)") {
control.style.borderColor = '#00ff00';
}
}
}
}
}
</script>
问题的屏幕截图
来自电子邮件的文本框变绿,但不应该是因为电子邮件不是有效的格式。它应该变红。那么,我怎样才能同时要求和验证,并显示所需字段的消息和无效格式?
答
您可以使用ASP.NET验证器完成此操作。尝试下面的代码片段。我已经将它用于我的一个项目,并且它应该可以正常工作。希望能帮助到你。
<asp:TextBox ID="txtbemail" runat="server" ValidationGroup="validation"/>
<asp:RequiredFieldValidator ID="requiredEmail" ForeColor="#E00000"
ControlToValidate = "txtbemail" ValidationGroup="validation"
runat="server" ErrorMessage="Necessary field" Text="*"/>
<asp:RegularExpressionValidator ID="regexEmailValid" runat="server" ValidationExpression="\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*" ControlToValidate="txtbemail" ValidationGroup="validation" ErrorMessage="Invalid e-mail format">*</asp:RegularExpressionValidator>
<asp:LinkButton ID="LinkButton1" CommandName="AddNew" runat="server" CssClass="btn btn-large btn-info pull-right" ValidationGroup="validation">
<i class="glyphicon glyphicon-plus"></i> Adicionar
</asp:LinkButton>
<asp:ValidationSummary ID="ValidationSummary" runat="server" ForeColor="#E00000" ValidationGroup="validation" />
答
您可以切换到CustomValidator
并设置ValidateEmptyText
为true。
<asp:CustomValidator ID="CustomValidator1" runat="server" ControlToValidate="TextBox1"
ClientValidationFunction="checkEmail" ValidateEmptyText="True" SetFocusOnError="true"></asp:CustomValidator>
<script type="text/javascript">
function checkEmail(sender, element) {
//these first 2 lines remove spaces and update the textbox
var emailToCheck = element.Value.replace(/ /g, "");
document.getElementById(sender.controltovalidate).value = emailToCheck;
var filter = /^([a-zA-Z0-9_\.\-\+])+\@(([a-zA-Z0-9\-])+\.)+([a-zA-Z0-9]{2,4})+$/;
element.IsValid = filter.test(emailToCheck);
}
</script>
您的代码工作正常,谢谢,但是当它显示必填字段时,我可以将它更改为红色吗?如果用户输入无效格式的电子邮件,我如何显示另一条消息? – Monteiro
很高兴我帮了忙。你当然可以。我编辑了我的答案,包括你需要的东西。请接受答案或赞成,因为它有帮助。 :) –