EDN Admin
Well-known member
Hi .. All
Sample Code for calling the mouseover event in asp.net calender Control
Design code
<html xmlns="http://www.w3.org/1999/xhtml
<head runat="server
<title></title>
<script type="text/javascript
function ShowInfo(id) {
var div = document.getElementById(id);
div.style.display = "block";
}
function HideInfo(id) {
var div = document.getElementById(id);
div.style.display = "none";
}
</script>
</head>
<body>
<form id="form1" runat="server
<asp:ScriptManager ID="ScriptManager1" runat="server
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Calendar ID="Calendar1" runat="server" ondayrender="Calendar1_DayRender
<SelectedDayStyle BackColor="#71BFD9" Font-Bold="True" />
<SelectorStyle BackColor="#FFCC66" />
<OtherMonthDayStyle ForeColor="Gray" />
<NextPrevStyle Font-Size="9pt" ForeColor="white" />
<TitleStyle
BorderStyle="solid" BorderColor="#71BFD9" BorderWidth="1px"
BackColor="#71BFD9" Font-Bold="True" Font-Size="9pt"
ForeColor="white" />
<DayHeaderStyle BorderStyle="solid" BorderColor="#71BFD9" BorderWidth="1px"
BackColor="#FECC58" Font-Bold="True"
Height="1px" ForeColor="#FFFFCC" Font-Size="9pt" />
</asp:Calendar>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
Cs page Code protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
{
if (e.Day.IsToday)
{
e.Cell.BackColor = System.Drawing.Color.Aqua;
}
if (e.Day.Date == new DateTime(2013,5,1))
{
e.Cell.BackColor = System.Drawing.Color.Red;
}
TextBox t1 = new TextBox();
t1.ID = "t" + e.Day.DayNumberText + e.Day.Date.Month.ToString();
t1.Width = 200;
t1.Height = 100;
t1.TextMode = TextBoxMode.MultiLine;
t1.Text = "Event in the day " + e.Day.DayNumberText; //you can get this from database instead
Panel p1 = new Panel();
p1.ID = "p" + e.Day.DayNumberText + e.Day.Date.Month.ToString(); ;
p1.Attributes.Add("style", "display:none;");
p1.Attributes.Add("style", "display:none;");
p1.Controls.Add(t1);
e.Cell.Controls.Add(p1);
e.Cell.Height = 70;
e.Cell.Attributes.Add("onmouseover", "ShowInfo(" + p1.ClientID + ")");
e.Cell.Attributes.Add("onmouseout", "HideInfo(" + p1.ClientID + ")");
}
Hope this Help
View the full article
Sample Code for calling the mouseover event in asp.net calender Control
Design code
<html xmlns="http://www.w3.org/1999/xhtml
<head runat="server
<title></title>
<script type="text/javascript
function ShowInfo(id) {
var div = document.getElementById(id);
div.style.display = "block";
}
function HideInfo(id) {
var div = document.getElementById(id);
div.style.display = "none";
}
</script>
</head>
<body>
<form id="form1" runat="server
<asp:ScriptManager ID="ScriptManager1" runat="server
</asp:ScriptManager>
<asp:UpdatePanel ID="UpdatePanel1" runat="server
<ContentTemplate>
<fieldset>
<legend>UpdatePanel</legend>
<asp:Calendar ID="Calendar1" runat="server" ondayrender="Calendar1_DayRender
<SelectedDayStyle BackColor="#71BFD9" Font-Bold="True" />
<SelectorStyle BackColor="#FFCC66" />
<OtherMonthDayStyle ForeColor="Gray" />
<NextPrevStyle Font-Size="9pt" ForeColor="white" />
<TitleStyle
BorderStyle="solid" BorderColor="#71BFD9" BorderWidth="1px"
BackColor="#71BFD9" Font-Bold="True" Font-Size="9pt"
ForeColor="white" />
<DayHeaderStyle BorderStyle="solid" BorderColor="#71BFD9" BorderWidth="1px"
BackColor="#FECC58" Font-Bold="True"
Height="1px" ForeColor="#FFFFCC" Font-Size="9pt" />
</asp:Calendar>
</fieldset>
</ContentTemplate>
</asp:UpdatePanel>
</form>
</body>
</html>
Cs page Code protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
{
if (e.Day.IsToday)
{
e.Cell.BackColor = System.Drawing.Color.Aqua;
}
if (e.Day.Date == new DateTime(2013,5,1))
{
e.Cell.BackColor = System.Drawing.Color.Red;
}
TextBox t1 = new TextBox();
t1.ID = "t" + e.Day.DayNumberText + e.Day.Date.Month.ToString();
t1.Width = 200;
t1.Height = 100;
t1.TextMode = TextBoxMode.MultiLine;
t1.Text = "Event in the day " + e.Day.DayNumberText; //you can get this from database instead
Panel p1 = new Panel();
p1.ID = "p" + e.Day.DayNumberText + e.Day.Date.Month.ToString(); ;
p1.Attributes.Add("style", "display:none;");
p1.Attributes.Add("style", "display:none;");
p1.Controls.Add(t1);
e.Cell.Controls.Add(p1);
e.Cell.Height = 70;
e.Cell.Attributes.Add("onmouseover", "ShowInfo(" + p1.ClientID + ")");
e.Cell.Attributes.Add("onmouseout", "HideInfo(" + p1.ClientID + ")");
}
Hope this Help
View the full article