Calling C# Method Using Javascript

Question

I am trying to access a method in my code behind called "Button1_Click" using Javascript, I think there is something wrong in my code below because currently I have to click twice in order for the method to trigger, one click doesn't trigger the method.

My Test Code:

// Javascript

<script type="text/javascript">
 function CallMe() { document.getElementById('<%= ButtonHidden.ClientID %>').click(); }
</script>

// Markup

<asp:Button ID="ButtonVisible" runat="server" Text="Test Button"
  OnClientClick="CallMe();"/>
<asp:Button ID="Button1" runat="server" style="display:none;" Text="Click"
  OnClick="Button1_Click"/>

// Code Behind Method

protected void Button1_Click(object sender, EventArgs e)
{
    Response.Redirect("http://google.com");
}

Am I missing something?

M4N · Accepted Answer · 2011-06-12 08:54:19Z

1

You could use the OnClientClick property of the Button:

<asp:button id="Button1"
   text="Test Button"
   onclientclick="CallMe()"
   runat="server" onclick="Button1_Click" />

Then you don't need another (hidden) button.

Your CallMe() method should then return either true (if everything is OK) or false (to cancel the postback).

answered Jun 12, 2011 at 8:54

M4N

96.8k45 gold badges225 silver badges265 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Osama Mortada Over a year ago

thanks for your answer but we should include "return CallMe()" in order to work as per Darin answer.

Darin Dimitrov · Accepted Answer · 2011-06-12 09:29:22Z

0

Instead of using javascript why not simply assign the same server click handler for both buttons:

<asp:Button 
    ID="ButtonVisible" 
    runat="server" 
    Text="Test Button" 
    OnClick="Button1_Click" />

<asp:Button 
    ID="Button1" 
    runat="server" 
    style="display:none;" 
    Text="Click" 
    OnClick="Button1_Click" />

UPDATE:

A better solution would be to have your javascript function return a boolean value depending on whether some conditions are met which will execute the server handler:

<script type="text/javascript">
    function CallMe() {         
        if (some condition) {
            return true; // allow the server to be called
        }
        return false;
    }
</script>

and then use both OnClick and OnClientClick on the button:

<asp:Button 
    ID="ButtonVisible" 
    runat="server" 
    Text="Test Button" 
    OnClientClick="return CallMe();"
    OnClick="Button1_Click" />

edited Jun 12, 2011 at 9:29

answered Jun 12, 2011 at 8:46

Darin Dimitrov

1.0m275 gold badges3.3k silver badges3k bronze badges

5 Comments

Osama Mortada Over a year ago

Actually the posted code was a sample to demonstrate the problem, the actual javascript checks if the form isDirty or not as follows: function checkDirty() { var ok; if (isDirty == 1) { ok = window.confirm("Continue without saving?"); if (ok == true) { document.getElementById('<%= Button1.ClientID %>').click(); } else { return true; } } }

Darin Dimitrov Over a year ago

@Osama Mortada, in this case you could use the CallMe javascript function simply perform the check and return true or false depending on the situation. If you return true it will proceed and invoke the server side handler. Just use the following: OnClientClick="return CallMe();" and don't try to simulate clicks.

Osama Mortada Over a year ago

@Darin Dimitrov: Thank you so much it works perfectly exactly as expected. This way is much cleaner than simulating clicks.

Darin Dimitrov Over a year ago

@Osama Mortada, if this answer helped you solve the issue consider marking it as such by clicking on the tick next to it.

Osama Mortada Over a year ago

@Darin Dimitrov is there anyway to handle the false return value? for example if the user clicked on a button I can show a confirmation box and then by clicking on OK (true) the form will be saved and by choosing Cancel or NO (false) another action will be performed such as changing the MultiView active index. Thank you.

Collectives™ on Stack Overflow

Calling C# Method Using Javascript

2 Answers 2

1 Comment

5 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

5 Comments

Your Answer

Sign up or log in

Post as a guest

Related