Solved

trouble referencing a button from Javascript

Posted on 2013-02-01
8
270 Views
Last Modified: 2013-02-01
Here's ASP for a button.  

<Tabor:ThemeButton runat="server" id="btnNext" button-causesvalidation="False" button-commandname="Redirect" button-onclientclick="nextClick();" button-text="Next >>" button-tooltip="Goto Next Tab"></Tabor:ThemeButton>

I'm trying to reference it in javascript using the code shown below but my btnNext var is always NULL.  What am I doing wrong?

var btnNext = document.getElementById("<%= btnNext.ClientID %>");
alert(btnNext);
0
Comment
Question by:HLRosenberger
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
  • 4
  • 4
8 Comments
 
LVL 38

Expert Comment

by:Tom Beck
ID: 38843973
Are you trying to reference the button before it exists on the page? If your script is in the head of the page and not inside a function, it will run before the button is rendered on the page and thus will be null when the alert is triggered.
0
 
LVL 1

Author Comment

by:HLRosenberger
ID: 38844011
It is in a function.   What I actually have is a "Next" button, like with a Wizard.  When I get to the last area of the Wizard, I want to disable the Next button.
0
 
LVL 38

Expert Comment

by:Tom Beck
ID: 38844094
On the rendered page, does <%= btnNext.ClientID %> resolve to the button id or does it leave a blank?
0
Free eBook: Backup on AWS

Everything you need to know about backup and disaster recovery with AWS, for FREE!

 
LVL 1

Author Comment

by:HLRosenberger
ID: 38844102
What do you mean?  is the button actually rendered and I can see it?  Yes.
0
 
LVL 38

Accepted Solution

by:
Tom Beck earned 500 total points
ID: 38844131
In the "view source" of the rendered page, look at how this javascript line appears:

var btnNext = document.getElementById("<%= btnNext.ClientID %>");

Does <%= btnNext.ClientID %> resolve to the button id or does it leave a blank
0
 
LVL 1

Author Comment

by:HLRosenberger
ID: 38844240
Ah, that's the ticket!   In view source it's ID =  "ctl00_PageContent_btnNext__Button"

So, this code works;

var btn = document.getElementById("ctl00_PageContent_btnNext__Button");

Thanks!
0
 
LVL 1

Author Closing Comment

by:HLRosenberger
ID: 38844242
thanks
0
 
LVL 38

Expert Comment

by:Tom Beck
ID: 38844280
Thanks for the points.

Be careful with that approach. You are circumventing asp.net's authority to create unique ids as it deems necessary. It will work and may continue working for the life of the application. But it may stop working after an asp.net version upgrade if Microsoft decides to change the way it auto-generates unique ids. What confuses me is if this line:

var btnNext = document.getElementById("<%= btnNext.ClientID %>");

is being rendered as:

var btn = document.getElementById("ctl00_PageContent_btnNext__Button");

then why is it not working the way you had it?
0

Featured Post

Webinar: Aligning, Automating, Winning

Join Dan Russo, Senior Manager of Operations Intelligence, for an in-depth discussion on how Dealertrack, leading provider of integrated digital solutions for the automotive industry, transformed their DevOps processes to increase collaboration and move with greater velocity.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

Nothing in an HTTP request can be trusted, including HTTP headers and form data.  A form token is a tool that can be used to guard against request forgeries (CSRF).  This article shows an improved approach to form tokens, making it more difficult to…
In this article we will learn how to fix  “Cannot install SQL Server 2014 Service Pack 2: Unable to install windows installer msi file” error ?
Viewers will learn how to use the SELECT statement in SQL to return specific rows and columns, with various degrees of sorting and limits in place.
Viewers will learn how to use the SELECT statement in SQL and will be exposed to the many uses the SELECT statement has.

738 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question