• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 287
  • Last Modified:

trouble referencing a button from Javascript

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
HLRosenberger
Asked:
HLRosenberger
  • 4
  • 4
1 Solution
 
Tom BeckCommented:
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
 
HLRosenbergerAuthor Commented:
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
 
Tom BeckCommented:
On the rendered page, does <%= btnNext.ClientID %> resolve to the button id or does it leave a blank?
0
The new generation of project management tools

With monday.com’s project management tool, you can see what everyone on your team is working in a single glance. Its intuitive dashboards are customizable, so you can create systems that work for you.

 
HLRosenbergerAuthor Commented:
What do you mean?  is the button actually rendered and I can see it?  Yes.
0
 
Tom BeckCommented:
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
 
HLRosenbergerAuthor Commented:
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
 
HLRosenbergerAuthor Commented:
thanks
0
 
Tom BeckCommented:
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

Free Tool: Subnet Calculator

The subnet calculator helps you design networks by taking an IP address and network mask and returning information such as network, broadcast address, and host range.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

  • 4
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now