How to use Javascript with Dynamic Controls in ASP.net

Question

0.00/5 (No votes)

See more:

Hi,

I want to use javascript with dynamic controls,
but the problem javascript method cannot see the dynamic control in the page, it give me error that:

document.getElementById(id) is null or nit an object

i pass the id of control to javascript method correctly, as i use alert to show the id and it right.
and all code in javascript method work right except this line
document.getElementById(id)

this is my method:

JavaScript

function SpecificMethod(id)
{
   // some code here work fine
  
  alert(id);  // give me right id 
  document.getElementById(id).disabled =true;  // give error
}

and this is the code which create the control dynamically:

C#

protected void Page_Load(object sender, EventArgs e)
    {
        LinkButton lbtnMyLink = new LinkButton();

        lbtnMyLink.Text = "Hello world";
        lbtnMyLink.ID = "lbtnMyLink_1";
        
        lbtnMyLink.OnClientClick = "SpecificMethod(" + lbtnMyLink.ClientID + ");return false";
        
        divTest.Controls.Add(lbtnMyLink);
    }

Posted 1-Nov-11 8:29am

MrLonely_2

Updated 1-Nov-11 19:45pm

v4

Add a Solution

2 solutions

Add a Solution

Add your solution here

Treat my content as plain text, not as HTML

Preview 0

…

Existing Members

Sign in to your account

...or Join us

Download, Vote, Comment, Publish.

Your Email
Password
Forgot your password?

Your Email
This email is in use. Do you need your password?
Optional Password

I have read and agree to the Terms of Service and Privacy Policy
Please subscribe me to the CodeProject newsletters

When answering a question please:

Read the question carefully.
Understand that English isn't everyone's first language so be lenient of bad spelling and grammar.
If a question is poorly phrased then either ask for clarification, ignore it, or edit the question and fix the problem. Insults are not welcome.
Don't tell someone to read the manual. Chances are they have and don't get it. Provide an answer or move on to the next question.

Let's work to help developers, not make them feel stupid.

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

Not Active · Answer 1 · 2011-11-01T13:44:00

Solution 1

Just because you get an id doesn't mean it is correct. Debug you script, look at the source to verify the actual id for the DOM element you are trying to use.

Since you have given us no clue as to what this control is or how it is used, remember ASP.NET will mangle the name. The id you assign in the markup may not be the same as what is rendered in the browser.

Posted 1-Nov-11 13:44pm

Not Active

Comments

MrLonely_2 1-Nov-11 19:50pm

Thanks man, but i tried one to pass (this) object to the method and it give the id as it rendered in the browser, and the problem still.
and i tried another one to pass id as it in server code and the same problem also.

[no name] 1-Nov-11 20:13pm

It may be helpful if you edit your question and post the markup you are using and show how you are calling the function

MrLonely_2 2-Nov-11 1:46am

I update my question,
thanks.

AspDotNetDev · Answer 2 · 2011-11-01T16:17:00

Solution 2

The server-side ID and the client-side ID are not the same. Try something like this:

document.getElementById("<%= serverSideControl.ClientID %>").disabled = true;

If you want to see an example client-side ID, just run your web application and right-click in IE and select "view source". That will show you the HTML that the ASP.Net renders to.

Also, do NOT hardcode the client-side ID you see... the client-side ID can change depending on a number of factors. Just use the ClientID property to get the client-side ID dynamically.

Posted 1-Nov-11 16:17pm

AspDotNetDev

Comments

MrLonely_2 2-Nov-11 1:47am

I already use ClientID,
please show it again i updated the question

AspDotNetDev 2-Nov-11 2:00am

A LinkButton will render in HTML as an anchor tag (an "A" tag). Anchor tags don't have a disabled property. Depending on what you are trying to acheive, you can add a click handler to the anchor tag that just returns false. That will prevent the click from happening. You may also want to add a class or some style that makes the anchor look disabled (e.g., gray rather than blue). You could also set the style to "display: none;" and that would completely hide the anchor tag... you could then show some text in its place (and maybe style it too look like an anchor tag that is disabled).

MrLonely_2 2-Nov-11 3:45am

Thanks man, but which LinkButton render as anchor, are you mean dynamic LinkButton or LinkButton as general,
I can disable LinkButton easy but in this case where i use dynamic control it has problem.
and i tried to use "display: none" and also give me the same error.

AspDotNetDev 2-Nov-11 11:13am

Did you Google how to set the display property to "none" before you tried to do it? It's a CSS property, so it's different than how you would set, for example, the "disabled" property.

AspDotNetDev 2-Nov-11 11:13am

Also, make note of the exact error you are being given, rather than just saying "give me the same error."