Hi,
If you want to do this using Client script then you have to set the
server-side visibility of the controls to true and hide them in the client
side code.
For example you can but a Div tag arround the callendar control (which is
rendered as HTML table) and in the page_load event. set the style.display
property to 'none'.
I tried it and it worked with me, please use this code snippet as a
guidance
<%@ Page language="c#" Codebehind="clientScript.aspx.cs"
AutoEventWireup="false" Inherits="testWebCS.clientScript" %>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>
<title>clientScript</title>
<meta name="GENERATOR" Content="Microsoft Visual Studio .NET 7.1">
<meta name="CODE_LANGUAGE" Content="C#">
<meta name="vs_defaultClientScript" content="JavaScript">
<meta name="vs_targetSchema"
content="
http://schemas.microsoft.com/intellisense/ie5">
<script type=text/Jscript>
function initializeState()
{
document.getElementById("Form1").TextBox1.style.display='none';
document.getElementById("calDiv").style.display='none';
}
function showHideElements(elementText)
{
if(elementText=='textBoxes')
{
document.getElementById("Form1").TextBox1.style.display='inline';
document.getElementById("calDiv").style.display='none';
}
else
{
document.getElementById("calDiv").style.display='inline';
document.getElementById("Form1").TextBox1.style.display='none';
}
}
</script>
</HEAD>
<body onload="initializeState()">
<form id="Form1" method="post" runat="server">
<P>
<asp:ListBox id="ListBox1" runat="server" Height="112px">
<asp:ListItem Value="textBoxes">textBoxes</asp:ListItem>
<asp:ListItem Value="Calendar">Calendar</asp:ListItem>
</asp:ListBox></P>
<P>
<asp:TextBox id="TextBox1" runat="server"></asp:TextBox></P>
<div id="calDiv">
<asp:Calendar id="Calendar1" runat="server" Height="200px"
BorderWidth="1px" BackColor="White"
Width="220px" DayNameFormat="FirstLetter" ForeColor="#003399"
Font-Size="8pt" Font-Names="Verdana"
BorderColor="#3366CC" CellPadding="1">
<TodayDayStyle ForeColor="White" BackColor="#99CCCC"></TodayDayStyle>
<SelectorStyle ForeColor="#336666" BackColor="#99CCCC"></SelectorStyle>
<NextPrevStyle Font-Size="8pt" ForeColor="#CCCCFF"></NextPrevStyle>
<DayHeaderStyle Height="1px" ForeColor="#336666"
BackColor="#99CCCC"></DayHeaderStyle>
<SelectedDayStyle Font-Bold="True" ForeColor="#CCFF99"
BackColor="#009999"></SelectedDayStyle>
<TitleStyle Font-Size="10pt" Font-Bold="True" Height="25px"
BorderWidth="1px" ForeColor="#CCCCFF"
BorderStyle="Solid" BorderColor="#3366CC"
BackColor="#003399"></TitleStyle>
<WeekendDayStyle BackColor="#CCCCFF"></WeekendDayStyle>
<OtherMonthDayStyle ForeColor="#999999"></OtherMonthDayStyle>
</asp:Calendar>
</div>
</form>
</body>
</HTML>
and in the code behind page
private void Page_Load(object sender, System.EventArgs e)
{
ListBox1.Attributes.Add("onclick","showHideElements(this.value)");
}
Regards,
Mohamed Sharaf
MEA Developer Support Center
ITWorx on behalf Microsoft EMEA GTSC