如果javascript验证失败,则阻止页面回发

时间:2013-07-22 06:50:44

标签: c# javascript asp.net validation

我已关注asp 文本框

<asp:TextBox ID="txtPasswrod" runat="server"></asp:TextBox>

在此文本框下方我错误消息标签最初隐藏,直到文本框的 js验证 失败

<label id="errorMsg" for="pwd" style="display:none">error</label >

以下是文字框验证 js

function validation() 
{
  var pwd = document.getElementById("txtPasswrod").value;
  if (pwd == null || pwd == "") 
  {
    document.getElementById("error").style.display = 'block';
    return false;
  }
}

以下是 asp按钮,其 OnClientClick 事件我正在调用 validation()函数:

<asp:Button ID="btnSubmit" runat="server" Text="Submit" 
     onclick="btnSubmit_Click" OnClientClick="validation()"/>

验证工作一切正常,但问题是当文本框 为空并且我的验证失败时 js 阻止页面回发,但 js允许页面回发,我的验证jst变为无用

请告诉我如何在js验证失败时阻止页面回发

2 个答案:

答案 0 :(得分:5)

validation()修改为return validation(),如果function返回false,这将停止发布。

<asp:Button ID="btnSubmit" runat="server" Text="Submit" 
     onclick="btnSubmit_Click" OnClientClick="return validation();"/>

答案 1 :(得分:4)

您需要对JS脚本稍作修改。您需要添加.ClientID,因为您指定的控件是服务器控件。或者,如果您使用的是.net 4.0,则可以使用ClientIDMode= "Static"来访问您在代码中使用的控件。

function validation() {
                var pwd = document.getElementById('<%=txtPasswrod.ClientID').value;
                if (pwd == null || pwd == "") 
                {
                    document.getElementById("errorMsg").style.display = 'block';
                    return false;
                }
            }

现在调用验证方法:

<asp:Button ID="btnSubmit" runat="server" Text="Submit" 
     onclick="btnSubmit_Click" OnClientClick="return validation();"/>