我正在尝试使用Jquery在按钮单击上验证字段,但问题是似乎事件和jquery事件后面的代码并行运行。
(修订版)
<asp:Button ID="btnsave" runat="server" ClientIDMode="Static" OnClientClick="return clientFunction()" CssClass="ButtonText"
Text="SAVE" OnClick="btnsave_Click" />
客户端验证:
<script type="text/javascript">
function clientFunction() {
var isValid = true;
$('#txtsupplieruserid,#txtsuppliername,#txtbusinessemailid,#txtorganizationname,#txtphonenumber,#txtcity,#txtstate,#txtpostalcode,#txtaddress').each(function () {
if ($.trim($(this).val()) == '') {
isValid = false;
$(this).css({
"border": "1px solid red",
"background": "#FFCECE"
});
}
else {
$(this).css({
"border": "",
"background": ""
});
}
});
if (isValid == false) {
e.preventDefault();
return isValid;
}
else {
return isValid;
}
}
</script>
我想首先通过Jquery进行验证,如果它通过了客户端验证,那么请转到代码后面。我想用Jquery而不是纯Javascript来做这件事。
答案 0 :(得分:1)
您可以使用OnClientClick
进行客户端验证,如果验证通过return true
,则return false
。如果返回true,则将调用服务器端函数,否则不会调用。
<asp:Button ID="btnsave" runat="server" ClientIDMode="Static" CssClass="ButtonText" Text="SAVE" OnClientClick="return clientFunction()" onclick="btnsave_Click" />
function clientFunction()
{
var isValid = true;
$('#txtsupplieruserid,#txtsuppliername,#txtbusinessemailid,#txtorganizationname,#txtphonenumber,#txtcity,#txtstate,#txtpostalcode,#txtaddress').each(function ()
{
if ($.trim($(this).val()) == '') {
isValid = false;
$(this).css({
"border": "1px solid red",
"background": "#FFCECE"
});
}
else {
$(this).css({
"border": "",
"background": ""
});
}
});
if (isValid == false) {
return false;
}
else {
return true;
}
}
如果您的控件为server controls
,则可能需要使用ClientIDMode="Static"
。所以他们的身份证保持不变。