首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >在asp.Net LinkButton OnClientClick上触发html5表单验证

在asp.Net LinkButton OnClientClick上触发html5表单验证
EN

Stack Overflow用户
提问于 2017-10-03 21:51:42
回答 5查看 1.6K关注 0票数 13

我有一个webform应用程序

在母版页中,我有一个窗体

代码语言:javascript
运行
复制
<body class="tile-1-bg">
<form id="form1" runat="server">

在我的page.aspx中

代码语言:javascript
运行
复制
<div class="control-group" runat="server" id="divNome">
    <label for="txtNome" class="control-label">Nome o Ragione Sociale*</label>
    <div class="controls">
        <asp:TextBox runat="server" ID="txtNome" class="form-control input-sm" required></asp:TextBox>
    </div>
</div>
<asp:Linkbutton runat="server" ID="lnkBtnRegistrati" class="btn btn-default btn-lg btn-block" Text="REGISTRATI" OnClientClick="if(checkForm())return true; else return false;" OnClick="lnkBtnRegistrati_Click"></asp:Linkbutton>

我想调用一个Javascript函数来模拟按钮提交,如果某些验证出错并在表单域上显示错误,则返回false。

代码语言:javascript
运行
复制
    function checkForm()
    {
         ?
    }

我该怎么做呢?

EN

回答 5

Stack Overflow用户

发布于 2017-10-06 18:40:15

您可以创建自己的验证并返回值。您需要将OnclientClick更改为OnClientClick="return checkForm()"

代码语言:javascript
运行
复制
<div id="errorSummary" style="display: none;">For is invalid!</div>

<script type="text/javascript">
    function checkForm() {
        var formIsValid = false;

        //do your form validation
        if ($("#<%= txtNome.ClientID %>").val() != "") {
            formIsValid = true;
        }

        //show or hide the error message
        if (!formIsValid) {
            $("#errorSummary").show();
        } else {
            $("#errorSummary").show();
        }

        //return the validation result
        return formIsValid;
    }
</script>

但是,您也可以使用Validaton控件和ValidationSummary执行相同的操作

代码语言:javascript
运行
复制
<asp:TextBox runat="server" ID="txtNome"></asp:TextBox>

<asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" 
    ErrorMessage="Input cannot be empty" ControlToValidate="txtNome" Display="Dynamic">
</asp:RequiredFieldValidator>

<asp:ValidationSummary ID="ValidationSummary1" runat="server" />

<asp:LinkButton runat="server" ID="lnkBtnRegistrati" Text="REGISTRATI"></asp:LinkButton>

请注意,只有最新的浏览器才支持输入字段的required属性,请参见https://www.w3schools.com/TAgs/att_input_required.asp

票数 3
EN

Stack Overflow用户

发布于 2017-10-06 18:34:07

你想要的是返回checkform的结果,你可以自己在checkform方法中处理它的状态:

Aspx代码

更改自

代码语言:javascript
运行
复制
<asp:Linkbutton runat="server" ID="lnkBtnRegistrati" class="btn btn-default btn-lg btn-block" Text="REGISTRATI" OnClientClick="if(checkForm())return true; else return false;" OnClick="lnkBtnRegistrati_Click"></asp:Linkbutton>

代码语言:javascript
运行
复制
    <asp:Linkbutton runat="server" ID="lnkBtnRegistrati" class="btn btn-default  
 btn-lg btn-block" Text="REGISTRATION" OnClientClick="return checkform();"  
 OnClick="lnkBtnRegistrati_Click"></asp:Linkbutton>

javascript方法中:

代码语言:javascript
运行
复制
function checkForm()
    {
        if(true) // your condition to check
       {
            return true;

       }
        else{
              return false;
           } 
    }

说明:

在标记中,无论您的条件是否满足,Onclientclick都将返回,如果您的条件满足,那么您将作为return true返回,反之亦然。所以通过这种方式你可以实现你想要的

票数 2
EN

Stack Overflow用户

发布于 2017-10-06 18:44:44

您可以在表单上调用submit(),这将触发浏览器验证。它没有任何返回值,但会自动提交表单。您的代码没有显示您需要在此之后执行其他操作,因此在OnClientClick事件中返回true或false是不必要的。

代码语言:javascript
运行
复制
document.getElementById("form1").submit();

但是,除非您遗漏了一个部分,否则将链接按钮替换为

代码语言:javascript
运行
复制
<input type="submit" runat="server" />
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/46546273

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档