我有一个webform应用程序
在母版页中我有表格
<body class="tile-1-bg">
<form id="form1" runat="server">
和我的page.aspx
<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>
我想调用一个模拟Button提交的Javascript函数,如果某些验证出错则返回false并在表单字段中显示错误。
function checkForm()
{
?
}
我该怎么办?
答案 0 :(得分:3)
您可以创建自己的验证并返回值。您需要将OnclientClick更改为OnClientClick="return checkForm()"
<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 Controls和ValidationSummary
中的内置版本执行相同的操作<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
答案 1 :(得分:1)
你想要的是返回checkform
的结果,你可以自己在checkform
方法中处理它的状态:
Aspx代码
从
改变<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>
到
<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 方法中:
function checkForm()
{
if(true) // your condition to check
{
return true;
}
else{
return false;
}
}
说明:
在标记中Onclientclick
将返回您的条件是否满足,如果您的条件满足,那么您将以return true
返回,反之亦然。所以通过这种方式你可以实现你想要的目标
答案 2 :(得分:1)
您可以在表单上调用submit(),这将触发浏览器验证。它没有任何返回值,但会自动提交表单。您的代码未显示您之后需要执行其他操作,因此无需在OnClientClick事件中返回true或false。
document.getElementById("form1").submit();
但除非你遗漏了一部分,否则用
替换链接按钮会更容易<input type="submit" runat="server" />
答案 3 :(得分:1)
我建议您使用jQuery.validationEngine。
<html>
<head>
<script src="../ValidationFiles/jquery.validationEngine-en.js"></script>
<script src="../ValidationFiles/jquery.validationEngine.js"></script>
<link href="../ValidationFiles/validationEngine.jquery.css rel="stylesheet"/>
<script type="text/javascript">
jQuery(document).ready(function () {
jQuery("#form1").validationEngine();
});
</script>
</head>
<body>
<form id="#form1">
<asp:TextBox ID="txtEmployeeAddress" runat="server" CssClass="form-control validate[required]"></asp:TextBox>
<asp:Button ID="btnFooterAddPopupSave" runat="server" class="btn btn-primary" Text="Add Category" OnClientClick="return jQuery('#form1').validationEngine();" OnClick="btnFooterAddPopupSave_Click" />
</form>
</body>
</html>
答案 4 :(得分:1)
如果您不想使用任何JavaScript插件,并且您要定位的浏览器支持它,则可以使用HTML5 form.checkValidity()和form.reportValidity()方法。您可以在HTML5 form support查看针对各个浏览器的此功能支持 - 请参阅表单验证部分。
使用示例如下:
UserFile