By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,543 Members | 2,116 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,543 IT Pros & Developers. It's quick & easy.

Can't access values via javascript in content page

ThatThatGuy
Expert 100+
P: 449
There's this aspx page proabably a content page....
There's a provision where i need to access a textbox (ASP or HTML Server)
value can't access it in content page even if i do

var str=document.getElementById("TextBox1").value;

or
even if it's inside a form

var str=form1.TextBox1.value;

or
can't even set the value of the textbox....
document.getElementById("TextBox1").value="UGGGHHH HHH";

And even this doesn't work...

var str=<%=TextBox1.Text%>;

The thing is Content pages don't support <head> tags so i unwillingly had to put all the javascript in the <asp:Content> section...

These above code are otherwise possible in any normal aspx page.....
Can anyone exlplain me the resion for this........
thank you...thanks......
Aug 2 '09 #1
Share this Question
Share on Google+
2 Replies


Frinavale
Expert Mod 5K+
P: 9,731
When you are using MasterPages your controls are rendered with Unique Client IDs in the browser. These ID's probably will not match the name that you have assigned them in your .NET code.


The reason this happens is because you can load several different pages into the ContentPlaceHolders in the MasterPage. Each of these pages may have the same name for the .NET control.

For example take the following MasterPage:

Expand|Select|Wrap|Line Numbers
  1. <%@ Master Language="VB" Inherits="System.Web.Mvc.ViewMasterPage" %>
  2.  
  3. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
  4. <html xmlns="http://www.w3.org/1999/xhtml">
  5. <head runat="server">
  6.     <title><asp:ContentPlaceHolder ID="TitleContent" runat="server" /></title>
  7.     <link href="Site.css" rel="stylesheet" type="text/css" />
  8. </head>
  9.  
  10. <body>
  11.         <div id="main">
  12.             <asp:ContentPlaceHolder ID="MainContent" runat="server" />
  13.             <asp:ContentPlaceHolder ID="FooterContent" runat="server" />
  14.         </div>
  15.     </div>
  16. </body>
  17. </html>
The above MasterPage has 3 ContentPlaceHolders where you can place content. The first one, the TitleContent, is used to add stuff to the Header section of the page via the content pages using this MasterPage. The second, MainContent, will display the "main content" page, and the last one contains "footer content".

ASP.NET assigns each element within the content pages a unique ID in order to ensure that every element within the ContentPlaceHolders gets a unique ID when it is rendered as HTML in the web browser.

So you may have a content page with a TextBox:
Expand|Select|Wrap|Line Numbers
  1. <asp:TextBox id="myTextBox" runat="server" />
But, because this content page is compiled along with the MasterPage the TextBox will end up with an HTML (clientID) of:

ctl00_MainContent_myTextBox

Or if it was in the footer ContentTemplateHolder it would look like:

ctl00_FooterContent_myTextBox


See how it works?

This is the ID that you need to use in your JavaScript.
The way to access this is to use the asp.net control's ClientID property.

So your JavaScript would look something like:

VB
Expand|Select|Wrap|Line Numbers
  1. var str=document.getElementById("<%= myTextBox.ClientID %>").value;
  2.  
C#
Expand|Select|Wrap|Line Numbers
  1. var str=document.getElementById("<%= myTextBox.ClientID(); %>").value;
  2.  

I was recently reading up on JavaScript loading times. Apparently it is best to place your JavaScript at the bottom of the page unless it NEEDS to be at the top (in the head section).

The reason is because of how things are rendered...if it's placed in the top of the page the the HTML and CSS has to wait to render while the JavaScript is being interpreted. But if you place it at the bottom of the page then the HTML and CSS can load quickly and then the JavaScript is interpreted.

So it's not bad to place it at the bottom of the page ...say in a Footer Section ;)
Aug 4 '09 #2

ThatThatGuy
Expert 100+
P: 449
thanks ....for your explanation....things worked...fine
i knew this...but didn't really clicked
Aug 6 '09 #3

Post your reply

Sign in to post your reply or Sign up for a free account.