Asp.Net button onclientclick problem - javascript

I have a strange problem, it seems, that I don't know how to solve.
I have a button like this:
<asp:Button ID="btnSave" runat="server" ClientIDMode="Static" Text="Save" OnClientClick="return ConfirmSave();" OnClick="btnSave_Click" />
If I write my client function like the following, it works as expected:
function ConfirmSave()
{
return confirm('Confirm?');
}
But I should check, inside the function, for the confirm result, like this:
function ConfirmSave()
{
if (Page_ClientValidate('validationGroup'))
{
var conf = confirm("Confirm?");
if (conf)
{
$('#btnSave').attr('disabled', 'disabled');
}
return conf;
}
else
return false;
}
Doing this, the page postback but the server click event doesn't fire.
Anyone could help? Thanks

use a timeout to disable the button immediately after your code completes and the submit happens.
if (conf)
{
setTimeout( function() { $('#btnSave').attr('disabled', 'disabled') }, 0 );
}

Yes its fires because the Button is input with submit type.
You probably have some other error, maybe a duplicate of your button id, in the page (because you have set it on static mode).
Check if you have give the btnSave again somewhere else, or check also if you have any JavaScript error.
(After your page is render, on your browser see the source code of your page and search for the btnSave id if exist more than one time)

If you have a method called btnSave_Click() in your code behind then when you post back it will fall into your Page_load method first and then fall into that method. If you are using VB then you will need a method with Handles btnSave_Click() after it.

Related

OnClientClick and OnClick relation not working on second hit

good evening!
I've been trying to use the OnClientClick and OnClick for a validation process. It means, I use the OnClientClick for a confirmation, and proceed with the OnClick if confirmed. The "no" is always ok, we are focusing on the "yes". It all goes well on the first hit, but on the second hit, the PostBack can be seen (it means the "click" was effective), but no action is triggered on code behind.
Here is the code:
<script type="text/javascript" >
function testExample(button) {
var confirmed = confirm("Are you sure?");
return confirmed;
}
</script>
<asp:Button ID="btnButton" runat="server" OnClientClick="if(!testExample(this)) return false;" OnClick="btnClicked" Text="Button Test"/>
On code behind there is nothing done, just a check if it was triggered:
protected void btnClicked(object sender, EventArgs e)
{
return;
}
Adding or removingUseSubmitBehavior="false" does nothing, as also setting ClientIDMode="Static" or AutoID.
Changing to OnClientClick="return testExample(this);" also has no impact. If I do on other buttons individually it happens the same, they all run the first time, the second fails. I am trying to avoid the CssClass and pageLoad() relation.
Can you help me figuring out what I am doing wrong or missing?
EDIT: This seems to happen every time there is a postback event, even after removing OnClientClick. This Button is not inside any place holder.
Change your OnClientClick event to
OnClientClick="return confirm('Are you sure?');"

Call Two Function OnClientClick

This is piece of my working code
<asp:LinkButton ID="lnkDel1" Text="Delete" runat="server" OnClientClick="return confirm('Delete this alert?','Confirm');" onClick="lnkDelete1_Click" CssClass="del_lnk" CommandArgument='<%#Eval("ID").ToString()%>' />
Now I Want to call another function bindBlockUI(); which block UI on client click so user may not click once again.
Now its generating alert with two button No and Confirm, When i click on No nothings happen but on confirm some event called.
I want to block UI as soon as User click on confirm from alert box.
How to achieve this.
Now I have done something like this and its working perfectly. It also not firing main function on cancellation from alert box. Although Thanks for answer beacause yours answers leads me to this answer
function clearItem()
{
var result = confirm('Delete this alert?', 'Confirm');
if (result) {
bindBlockUI();
return true;
} else {
return false;
}
}
first define a common function:
function myFunction(){
var o=confirm('Delete this alert?','Confirm');
bindBlockUI();
return o;
}
Now call it like this:
<asp:LinkButton ID="lnkDel1" Text="Delete" runat="server" OnClientClick="return myFunction();" onClick="lnkDelete1_Click" CssClass="del_lnk" CommandArgument='<%#Eval("ID").ToString()%>' />
It would be quite easier to read if you define a function.
function onClientClick() {
var result = confirm('Delete this alert?','Confirm');
bindBlockUI();
return result;
}
Then: OnClientClick="return onClientClick();"
But you should really avoid using inline handlers in favor of addEventListener.
document.getElementById('lnkDel1').addEventListener('click', onClientClick);
However if you use addEventListener you must change the code slightly to prevent the default event from fireing.
function onClientClick(e) {
if (!confirm('Delete this alert?','Confirm')) e.preventDefault();
bindBlockUI();
}

How to trigger server side button's click event after javascript confirm dialog returns true

I have an input as count named in a repeater with hdncount hidden input. And I have a server side button out of repeater. This script runs onblur event of count. I want to trigger server side button's click event if client click OK button on confirmation. What should I do to do that?
<script type="text/javascript">
function changeItemCount(input) {
var hdnCount = $(input).closest("div").find("input[id=hdnCount]").val();
var crrCount = $(input).closest("div").find("input[id=count]").val();
if (hdnCount != crrCount) {
var answer = confirm("Ürün adedi değiştirilecektir. Onaylıyor musunuz?");
return answer;
} else {
return true;
}
}
</script>
How to fire a button click event from JavaScript in ASP.NET
var answer = confirm("Ürün adedi değiştirilecektir. Onaylıyor musunuz?");
if(answer)
__doPostBack('btnSubmit','OnClick'); //use the server-side ID of the control here
Use OnClientClick together with OnClick
<asp:Button ID="btnGo" runat="server" Text="Go" OnClick="btnGo_Click" OnClientClick="return CheckGoJSEvents();" />
EDIT:
Didn't see that you had the function execute on the blur event. In that case you would not use the OnClientClick of the button. The answer posted by mattmanser would be correct.
If you wanted it to function from the button click, then you could use this method. Sorry for the confusion.

How to fire both client side and server side click events of button?

For a requirement, I need to fire both client side and server side click events of a button in ASP.NET. Is that possible? I have tried like the below. But it does not fire client side click event.
[ASPX]
<asp:Button ID="Button1" runat="server" Text="Disable" OnClick="disable" CausesValidation="false" OnClientClick="return click();" />
[Script]
function click()
{
alert("hi")
}
Yes, it's possible. If the client side Javascript returns true then the server-side method will get called.
For example:
function click()
{
return confirm("Do you want to continue?");
}
<asp:Button ID="Button1" runat="server" Text="Disable" OnClick="disable" CausesValidation="false" OnClientClick="click();" />
function click()
{
alert("hi");
this.click();
}
The client side function must be called in your code. Only thing is depending on what it returns the server side function will get called:
function Click() {
alert('Hi');
if (somecondition) {
return true;
}
return false;
}
Also check your server side event handler if it is named correct as you mention in your code "disable". I think this isnt proper name.
Also check if you really need CausesValidation attribute? as this would have been for your validater which might no longer needed as client side function is manually called.

Make submit delay before POST

I have button
<UpdatePanel>
<asp:Button CssClass="btn-send" runat="server"
OnClick="SendMessage" Text="Send" />
</UpdatePanel>
Server side method
protected void SendMessage(object sender, EventArgs e){...}
I need to make little delay and show progress bar animation before POST. I would like to use javascript (jquery) for this.
How to make this delayed submit
1) without server delay
2) without second button with client script, which click server button?
You could try something like this...
<asp:Button runat="server" OnClick="SendMessage" Text="Send"
OnClientClick="return sendMessage(this);" />
<script type="text/javascript">
var sendBtn = null;
function sendMessage(btn){
if(sendBtn==null){
sendBtn = btn;
window.setTimeout(function(){ sendBtn.click(); }, 1000);
// DO YOUR VISUAL STUFF HERE
return false;
}else{
return true;
}
}
</script>
The idea is that the clicking of the button first stores the button object, sets a timeout to click the button, and then does the visual things you want to do.
Then after one second, the button is clicked again (this time not doing the timeout section)
(I have not had time to learn jquery yet, but I'm sure there is a simpler way to do this with it)
You can do this without jQuery, just using a regular Javascript setTimeout.
You can capture the onsubmit of your form, and then when you have submit (your button is pressed) you open your wait message of the page. So you add this line on Page_Load()
Page.Form.Attributes["onsubmit"] = "return AllowFormToRun();";
and the javascript:
<script>
function AllowFormToRun()
{
setTimeout(OpenWaitMsg, 10);
return true;
}
function OpenWaitMsg()
{
// open here the wait div
}
</script>
You should use Event.preventDefault() on the submit button click to prevent the page from submiting on click. Then start your progress animation, when its complete, call your form submit from the js.
$("form").submit(function(e){
var form = this;
e.preventDefault();
function animation(total,callback){
//perform your animation
callback();
};
animation(100,function(){
form.submit();
});
});

Categories

Resources