Call JavaScript function from codebehind(c#) is not working

Question

I am trying to call a Javascript from the codebehind but form some reason it is not working. Let me explain what i am trying to accomplish: when the page loads the system needs to check if this is the first time the user visit this page. if so a lightbox will open. So I created a javascript function in the page the onPageLoad i would like to call this function if it is necesary. This is what I have so far, looks pretty straight forward but it is not working. I will appreciate any help.

Here is the

html:

  <form id="form1" runat="server">
  <div>

  <a id="OpenTutorial"  href="../lightwindow/step1.html" params="lightwindow_width=450,lightwindow_height=470" class="lightwindow page-options">Open Tutorial</a>


  </div>


  <script>
    function OpenTutorial() { $("#OpenTutorial").click() }
   </script>

  </form>

Code behind:

    protected void Page_Load(object sender, EventArgs e)
    {

  //code to check if this is the first time
  ..... 
  // it this is the first time, call this function 
   Page.ClientScript.RegisterStartupScript(this.GetType(), "CallMyFunction", "OpenTutorial()", true);

    }

Hi Igor, in the <head> i have this <script src="ajax.googleapis.com/ajax/libs/jquery/1.11.1/…> — Carlos
– Carlos, Commented Nov 18, 2014 at 0:19
also, in OpenTutorial function add alert($("#anc_OpenTutorial").length); as first line — Igor
– Igor, Commented Nov 18, 2014 at 0:22
I added the alert and it displayed the length, but for some reason the click function doesn't work, I think the problem are the libraries that I am using for the lightbox. because I tested your solutions in other pages with the lightbox and it worked. — Carlos
– Carlos, Commented Nov 18, 2014 at 16:01

mark879 · Accepted Answer · 2014-11-17 22:25:58Z

1

Maybe try using jQuery's trigger function, ie:

function OpenTutorial() { $("#OpenTutorial").trigger('click'); }

answered Nov 17, 2014 at 22:25

mark879

874 bronze badges

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

1 Comment

mark879 Over a year ago

Bummer. The only other thing I can think of, is maybe the DOM object has not been created yet when the script is ran. Inside of the ASP.NET call to register the startup script, try $(document).ready(function(){OpenTutorial();}); instead of OpenTutorial().

epascarello · Accepted Answer · 2014-11-17 22:48:36Z

1

Change the id or the name of the function so they are different, they are clashing in the global namespace.

<a id="anc_OpenTutorial" />

<script>
    function OpenTutorial() { $("#anc_OpenTutorial").click() }
</script>

OR just call clicking the link with the code instead of calling the function.

TO follow the link change it to access the DOM element

$("#anc_OpenTutorial")[0].click()

or

$("#anc_OpenTutorial").get(0).click()

edited Nov 17, 2014 at 22:48

answered Nov 17, 2014 at 22:07

epascarello

208k20 gold badges206 silver badges246 bronze badges

4 Comments

Carlos Over a year ago

epascarello, thank you for you response. I made the changes but still doesn't work.

Carlos Over a year ago

I added an alert("Test") before clicking the anchor and the alert is successfully display but for some reason I can't simulate the click on the anchor.

epascarello Over a year ago

$("#anc_OpenTutorial")[0].click()

Carlos Over a year ago

Hey guys, thank you so much for your help unfortunately i wasn't able to make it work, i am building a work around but i will test your solutions, maybe combine them and i will let you know the outcome tomorrow.

Aswin Ramakrishnan · Accepted Answer · 2014-11-17 23:06:19Z

1

How about refactoring your javascript function as follows?

<form id="form1" runat="server">
<div>

<a id="OpenTutorial"  href="../lightwindow/step1.html" params="lightwindow_width=450,lightwindow_height=470" class="lightwindow page-options">Open Tutorial</a>

</div>


<script>
  // Function that Opens the Tutorial
  function OpenTutorial() { 
      // Using colorbox for an example, but you can start the lightbox through the function
      $('#OpenTutorial').colorbox(); 
  }

  $("#OpenTutorial").click(function(){ OpenTutorial() });
 </script>

</form>

Code Behind:

protected void Page_Load(object sender, EventArgs e)
{
   //code to check if this is the first time
   ..... 
   // it this is the first time, call this function 
   Page.ClientScript.RegisterStartupScript(this.GetType(), "CallMyFunction", "OpenTutorial()", true);
}

EDIT: Updating the OpenTutorial function to start a lightbox as opposed to opening the link

edited Nov 17, 2014 at 23:06

answered Nov 17, 2014 at 22:51

Aswin Ramakrishnan

3,2132 gold badges43 silver badges65 bronze badges

4 Comments

Carlos Over a year ago

Aswin Ramakrishnan, thank you for you response, your solution opens a new window, i am using a light box to display step1.html. For some reason i am not able to click on the anchor, I am using this jquery files: <script src="code.jquery.com/jquery-1.11.0.min.js"></script> <script src="code.jquery.com/jquery-migrate-1.2.1.min.js"></…>

Aswin Ramakrishnan Over a year ago

Ok.. I see! How about calling the light box function within OpenTutorial to start the tutorial instead of any attributes that you may have.

Aswin Ramakrishnan Over a year ago

About the anchor tag. Are you sure you are not making a recursive call to the OpenTutorial function. I hope you don't have $('#OpenTutorial').click() within the OpenTutorial function :)

Carlos Over a year ago

Aswin Ramakrishnan, hey man thank you for trying to help me, I copied your solution exactly as you posted and not luck

Collectives™ on Stack Overflow

Call JavaScript function from codebehind(c#) is not working

3 Answers 3

1 Comment

4 Comments

4 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

4 Comments

4 Comments

Your Answer

Sign up or log in

Post as a guest

Related