[英]Disable Button placed inside an ASP.NET template upon click using Javascript
I hava an ASP.NET Web Forms application. 我有一个ASP.NET Web窗体应用程序。
My goal is to disable the submit button btnFinish
upon user click, in order to avoid multiple submits. 我的目标是在用户点击时禁用提交按钮
btnFinish
,以避免多次提交。
<asp:Button ID="btnFinish" runat="server" Text="Finish" UseSubmitBehavior="false"
CausesValidation="true" CommandName="MoveComplete" CssClass="buttonStyle"/>
The Javascript function is: Javascript函数是:
function Validate(btnFinishId) {
btnObj = document.getElementById(btnFinishId)
if (Page_IsValid) {
btnObj.disabled = true
}
else {
alert('Page has some validation error');
}
// this is to prevent the actual submit
e.preventDefault();
return false;
};
btnFinish
is placed within a FinishNavigationTemplate
in a ASP.NET Wizard Control. btnFinish
放在ASP.NET向导控件的FinishNavigationTemplate
中。 Therefore, in order to avoid runtime errors, I need to get the ClientID
of the control programmatically and then add it to the OnClientClick
event of the button: 因此,为了避免运行时错误,我需要以编程方式获取控件的
ClientID
,然后将其添加到按钮的OnClientClick
事件:
Button btFinish = MyWizard.FindControl("FinishNavigationTemplateContainerID$btnFinish") as Button;
if (btFinish != null){
btFinish.Attributes.Add("onclientclick", "Validate('" + btFinish.ClientID + "');");
}
But it does not work. 但它不起作用。 I use Firebug to check the page rendered by the browser but although the source code looks perfect, upon click the Javascript function is not executed .
我使用Firebug来检查浏览器呈现的页面,但是虽然源代码看起来很完美,但是在单击时不会执行 Javascript函数。
If in the Javascript function I replace Validate(btnFinishId)
with Validate()
and instead of using the code behind to add the OnClientClick
I write: 如果JavaScript函数替换我
Validate(btnFinishId)
与Validate()
转而使用后面的代码中添加OnClientClick
我写的:
<asp:Button OnClientClick="Validate();" "ID="btnFinish" runat="server" Text="Finish" UseSubmitBehavior="false"
CausesValidation="true" CommandName="MoveComplete" CssClass="buttonStyle"/>
The function is executed but of course does not do what I want, because the button Id is missing. 该函数被执行,但当然不能做我想要的,因为缺少按钮Id。 Anybody has a solution?
有人有解决方案吗?
You're on the right track. 你走在正确的轨道上。 Something like this should work:
这样的事情应该有效:
<script type="text/javascript">
validate = function(btn){
//trigger client-side validation
var valid = Page_ClientValidate("");
//disable the button if the form is valid
btn.disabled = valid;
//trigger postback if the form is valid
//otherwise do nothing
return valid;
}
</script>
<asp:Button ID="btnFinish" runat="server" Text="Finish" OnClientClick="return validate(this);" OnClick="btnFinish_Click" ... />
It looks kind of backwards, but you could shorten the function like this: 它看起来有些倒退,但你可以像这样缩短函数:
<script type="text/javascript">
validate = function(btn){
btn.disabled = Page_ClientValidate("");
return btn.disabled;
}
</script>
One way is to create a normal HTML button on your page, add attach a click event with jQuery. 一种方法是在页面上创建一个普通的HTML按钮,使用jQuery添加附加一个click事件。 You can then hide the .net button using css.
然后,您可以使用css隐藏.net按钮。
In the click event for your html buttom, you can all the .net buttons click event. 在html按钮的click事件中,您可以使用.net按钮单击事件。
$("#yourbutton").trigger("click");
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.