JavaScript don't hide text area in asp.net

Question

I have strange problem with Javascript, I am trying to implement system to update some stuff, and when I press button I want to hide everything except 'MainContent_UpdateProgress', but text area is still visible.

Text area in asp.net looks like this:

<textarea runat="server" id="serverOutputTextArea" cols="50" rows="30" name="serverOutputTextArea" visible="false">

Javascript code:

var prm = Sys.WebForms.PageRequestManager.getInstance();

prm.add_initializeRequest(InitializeRequest);
prm.add_endRequest(EndRequest);
var postBackElement;
function InitializeRequest(sender, args) {
    if (prm.get_isInAsyncPostBack())
        args.set_cancel(true);
    postBackElement = args.get_postBackElement();

    if (postBackElement.id == 'MainContent_UpdateAnalysisSystem') 
    {
        $get('MainContent_serverOutputTextArea').style.display = 'none'; //Doesn't work

        $get('MainContent_UpdateProgress').style.display = 'block'; //Works
        $get('MainContent_ProcessingStatus_Label').style.display = 'none'; //Works
        $get('MainContent_ShowDetails_Button').style.display = 'none';  //Works
    }
}

Question would be, what is different in textarea ?

Is the client ID of the text area 'MainContent_UpdateAnalysisSystem' its not get something like 'ctl00_ContentPlaceHolder1_MainContent_UpdateAnalysisSystem' — theedam
– theedam, Commented Jun 18, 2012 at 13:26

The Jonas Persson · Accepted Answer · 2012-06-18 13:28:53Z

2

Have you looked in the browser's source code to see what the actual id of the textarea is? It might be that you have it placed within some other element and it has inherited a longer id.

Otherwise, you can get the id by using this: <%= serverOutputTextArea.ClientID%>

The javascript line would look like this:

$get('<%= serverOutputTextArea.ClientID %>').style.display = 'none';

answered Jun 18, 2012 at 13:28

The Jonas Persson

1,7461 gold badge17 silver badges38 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

The Jonas Persson Over a year ago

I noticed @Fabio-Milheiro updated answer, and he's right. The problem you have is that you are user visible="false" on a control that that has runat="server". That means that the control is never rendered, and the javascript can't find it. If you change visible="true" to style="display: none;" it should work.

Fabio Milheiro · Accepted Answer · 2012-06-18 13:28:39Z

1

Just to confirm: Is MainContent_serverOutputTextArea the id of the textarea?

If yes, can you go to Firebug and try setting the display style attribute to none? Or out of despair try visibility=hidden.

But ultimately, you need to make sure that $get is selecting the correct element in the DOM.

UPDATE

Mmmmm... I think I know what's going on. You have:

<textarea runat="server" id="serverOutputTextArea" ... visible="false">

You added the runat="server" to the textarea so it'll be a server control and if the Visible property is false, it simply won't be rendered to the HTML.

Do you know what this means? If it's not rendered, your JavaScript won't be able to see it and select. Set the Visible property to true and it will work.

answered Jun 18, 2012 at 13:28

Fabio Milheiro

8,54420 gold badges63 silver badges104 bronze badges

3 Comments

Full_Int Over a year ago

Changed visible to true but still same thing. It works when I change CSS. But how to toggle CSS? because I need to show it later.

The Jonas Persson Over a year ago

If you want to toggle the CSS I would recommend you use JQuery. You can find it here. Set it up like this <script src="http://docs.jquery.com/Downloading_jQuery"></script> and then you simple call the toggle function like this $(#'<%= serverOutputTextArea.ClientID %>').toggle()

Fabio Milheiro Over a year ago

@Full_int, did confirm that the textarea id is the one you're looking for?

Collectives™ on Stack Overflow

JavaScript don't hide text area in asp.net

2 Answers 2

1 Comment

UPDATE

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

UPDATE

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related