Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

calling javascript function on OnClientClick event of a Submit button

In my asp.net page, I have three text boxes and one button.
First two text boxes are being used to get the value from the user and third one is being used to show the sum of first two boxes.

I am calling a javascript function to sum the values and show the result value on OnClientClick event of that BUTTON.

JS function is working fine but when I am pressing button to get the sum, it shows the result in third text box and just then the page is being post-back and result value becomes disappear from the third text box.

Why the post-back is called by the button?
I don't want page to be post-backed on click of submit button.

Any suggestion is appreciated.

like image 558
Ravindra Kumar Avatar asked Jun 07 '13 08:06

Ravindra Kumar


People also ask

How do you call two Javascript functions OnClientClick of a button?

onClientClick="(return f1();return f2();return f3();)" but I am not getting output. OnClick event is fired you have to specify the handler for that event ...from that handler you can call multiple functions..

How do I use OnClientClick?

The OnClientClick property is used to sets a client side script to be run when the Button control is clicked. The script specified in this property is run by the Button's event "OnClick" in addition to the predefined script.

What is the difference between OnClick and OnClientClick in asp net?

OnClick will work on server side , OnClientClick will execute on client side before control passed to server. If the client side code returns TRUE then it will go to server. Generally programmers use onClientClick to validate the controls like textbox,etc.

How do I stop postback on OnClientClick?

Use OnClientClick and return false to prevent your button from executing a postback.


2 Answers

<asp:Button ID="btnGet" runat="server" Text="Get" OnClick="btnGet_Click" OnClientClick="return callMethod();" />
<script type="text/javascript">
    function callMethod() {
        //your logic should be here and make sure your logic code note returing function
        return false;
}
</script>
like image 132
sangram parmar Avatar answered Oct 18 '22 21:10

sangram parmar


The above solutions must work. However you can try this one:

OnClientClick="return SomeMethod();return false;"

and remove return statement from the method.

like image 23
Pushpendra Avatar answered Oct 18 '22 22:10

Pushpendra