Show/Hide Placeholder in JavaScript

Show/Hide Placeholder in JavaScript

• Milzit

  Kim,

  A user control is made up of a group of html elements (usually a containing div and other elements that make up the control inside that div), so you won't necessarily be able to reference it by the id that you assign server side.

  You should be able to view source after your page is rendered so you can see what asp.net as decided to name the individual controls and then either show/hide the containing control or individually show/hide the controls it contains.

  
  
  

• Pat2214

  Hi Geetha Paul,

  Thanks for your help, I found the solution juhuuuu :o)

  function ShowHide(_ControlId)
  {
  var div = document.getElementById(_ControlId);
  if ( div.style.display == 'none' )
  {
  div.style.display = 'block'
  }
  else
  {
  div.style.display = 'none'
  }
  window.event.returnValue = false;
  }

  
  
  

• DavidP35910

  Kim,

  Have you tried to show/hide the child control you're adding directly from your JS I think if you view source after your page is displayed you'll find that the control you added from server side exists in the html and that you can directly reference it.

  
  
  

• jeje1g

  Kim,

  According to MSDN the place holder control is designed so that you can dynamically add child controls to it at runtime. When you add child controls to it the place holder control no longer exists on the page so you shouldn't be able to get a reference to it and attempting to operate on it should cause an error.

  What exactly are you tring to accomplish

  
  
  

• Steven Weinert

  Hi Trevor,

  That sounds like a great idea, could you show me how you would do that I tried to get a reference to it from JS but something is wrong. And i'm not sure how to get it right. Could you please give me an example.

  Thanks

  Kim

  
  
  

• JakkyTchong

  1 var theElement = document.getElementById("myPlaceholder");

  2 theElement.style.Visibility = 'visible';

  3 alert("HI");

  If Line 2 is there nothing happens, is line 2 is not there it says HI.

  So it does not work using the theElement.style.visibility = 'visible';

  
  
  

• Angelo_B

  Hi Kim,

  I am completely new to these things,but I have a suggestion regarding ur matter...

  document.getElementById('CalendarPicker').setAttribute('vivibility', 'hidden');

  I hope this will workout. Sorry if this doesn't work.

  All the best

  Regards

  Geetha Paul
  

  
  

• sadavies

  Hi Trevor,

  Okay, we are getting closer.........

  This control that I add to the place holder is an ASCX (UserControl), so what I do after reading you code is this:

  Loading the Usercontrol giving it an ID name, and calling it from JavaScript. The 'Hi1' is coming up so the function is called, but the it stoppes.........

  protected void Page_Load( object sender, EventArgs e )
  {

  Control MyControl = LoadControl("CalendarPicker.ascx");

  MyControl.ID = "CalendarPicker";

  myPlaceHolder.Controls.Add(MyControl);

  }
  
  

• euroelettra

  Kim,

  I'm not positive if you can set the visibility of a place holder but I think your script should look like this: theElement.style.visibility = 'visible';. I might be incorrect but I think Microsofts client side implementations of their server objects behave just as other javascript objects do.

  HTH

  
  
  

• Tim Smith

  Kim,

  Here's an example of dynamically adding a control and then hiding that control when it's clicked:

  Code Behind:

  private void Page_Load(object sender, System.EventArgs e)

  {

  HtmlInputButton btn = new HtmlInputButton();

  btn.Value = "click me";

  btn.ID="bntNew";

  btn.Attributes.Add("onclick","onClick();");

  placeHolder.Controls.Add(btn);

  }

• hernanac

  What i'm trying to accomplish is that :

  I have at control that i was adding to the placeholder dynamicly, from code behind. But now I want to make it possible for the user to click on a button that shows or hide the Placeholder or the control on the Placeholder. BUT it have to be done without post back because it takes to long time. Therefore I whant to create som Java script that takes the Place holder and makes it visible or not.

  See what I meen

  Thanks

  Kim

  
  
  
• Show/Hide Placeholder in JavaScript