Solved

trouble referencing a button from Javascript

Posted on 2013-02-01
8
269 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
  • 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
Use Case: Protecting a Hybrid Cloud Infrastructure

Microsoft Azure is rapidly becoming the norm in dynamic IT environments. This document describes the challenges that organizations face when protecting data in a hybrid cloud IT environment and presents a use case to demonstrate how Acronis Backup protects all data.

 
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

Independent Software Vendors: We Want Your Opinion

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

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

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…
The article shows the basic steps of integrating an HTML theme template into an ASP.NET MVC project
Via a live example, show how to setup several different housekeeping processes for a SQL Server.
Viewers will learn how to use the UPDATE and DELETE statements to change or remove existing data from their tables. Make a table: Update a specific column given a specific row using the UPDATE statement: Remove a set of values using the DELETE s…

679 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