asp:Calendar problems

I have an asp:calendar control that is functioning differently depending on the browser that is being used. Everything works fine when using IE, when any other browser is used the functionality breaks. Also when the mouseover styles are removed everything works fine in all browsers...see example below

On the DayRender event I add mouseover styles and then add LinkButtons to a gridview control and then add that gridview control to the calendar cell. See code below…

I am adding an attribute to the LinkButton to fire a postback event when clicked. I then determine what LinkButton caused the postback in the Page_Load event.

When using IE here is the sequence of events when a link is clicked:
Link is Clicked.
Page_Load //(cntrlname = Calendar1)
Calendar1_SelectionChanged
Page_Load //(cntrlname = LinkButton_TestingEvent_xx)
Link_Click

When I run with any other browser the sequence is:
Link is clicked.
Page_Load //(cntrlname = Calendar1)
Calendar1_SelectionChanged
It’s like the link was never clicked…

If I comment out the ApplyMouseOverStyles(e) method it works fine with all browsers and the sequence of events is:
Link is clicked.
Page_Load //(cntrlname = LinkButton_TestingEvent_xx)
Link_Click

Here is an example of what I am trying to do:

HTML:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="CalendarTest.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Calendar ID="Calendar1" runat="server" ondayrender="Calendar1_DayRender" onselectionchanged="Calendar1_SelectionChanged" Height="629px" Width="908px"></asp:Calendar>
    </div>
    </form>
</body>
</html>

Open in new window


CodeBehind:

public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            string cntrlname = Page.Request.Params.Get("__EVENTTARGET");
            if (!string.IsNullOrEmpty(cntrlname))
            {
                if (cntrlname.Contains("LinkButton_TestingEvent"))
                {
                    Link_Click(cntrlname);
                }
            }
        }
        
        protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
        {
            ApplyMouseOverStyles(e);
            AddLink(e);
        }
        
        protected void Calendar1_SelectionChanged(object sender, EventArgs e)
        {
            //handle event
        }
        
        private void Link_Click(string cntrlname)
        {
            //Do some stuff here....
        }
        
        private void ApplyMouseOverStyles(DayRenderEventArgs e)
        {
            string onmouseoverStyle = "this.style.backgroundColor='#D4EDFF'";
            string onmouseoutStyle = "this.style.backgroundColor='White'";
            string onmouseoutStyleOther = "this.style.backgroundColor='White'";

            e.Cell.Attributes.Add("onmouseover", onmouseoverStyle);

            if (e.Day.IsOtherMonth)
                e.Cell.Attributes.Add("onmouseout", onmouseoutStyleOther);
            else
                e.Cell.Attributes.Add("onmouseout", onmouseoutStyle);

            e.Cell.Attributes.Add("OnClick", e.SelectUrl);
            e.Cell.Style.Add("cursor", "pointer");
        }
        
        private void AddLink(DayRenderEventArgs e)
        {
            DataTable dataTable = new DataTable();
            dataTable.Columns.Add("ID");
            dataTable.Columns.Add("Title");

            DataRow newRow = dataTable.NewRow();
            newRow["ID"] = "10";
            newRow["Title"] = "Testing";
            dataTable.Rows.Add(newRow);

            GridView gv = new GridView();
            gv.ID = "GridView_" + e.Day.DayNumberText;
            gv.RowDataBound += new GridViewRowEventHandler(gv_RowDataBound);

            gv.DataSource = dataTable;
            gv.DataBind();

            gv.HeaderRow.Visible = false;
            foreach (GridViewRow gvr in gv.Rows)
            {
                gvr.Cells[0].Visible = false;
            }

            e.Cell.Controls.Add(gv);
        }
        
        void gv_RowDataBound(object sender, GridViewRowEventArgs e)
        {
            if (e.Row.RowType == DataControlRowType.DataRow)
            {
                LinkButton link = new LinkButton();
                
                link.ID = "LinkButton_TestingEvent_" + (e.Row.Cells[0]).Text;

                link.Text = ((e.Row.Cells[1])).Text;
                link.Attributes.Add("href", "javascript:__doPostBack('" + link.ID + "','')");
                link.ForeColor = Color.Blue;
                e.Row.Cells[1].Controls.Add(link);
            }
        }
    }

Open in new window


I really want to include the mouseover styles, so removing them is not really the solution I am looking for. Any suggestions to get this working?

Thanks in advance!
rypinbubsAsked:
Who is Participating?
I wear a lot of hats...

"The solutions and answers provided on Experts Exchange have been extremely helpful to me over the last few years. I wear a lot of hats - Developer, Database Administrator, Help Desk, etc., so I know a lot of things but not a lot about one thing. Experts Exchange gives me answers from people who do know a lot about one thing, in a easy to use platform." -Todd S.

Tom BeckCommented:
Have you tried adding a hover pseudo class for those cells. Seems like it would be much easier if you only need to change the background color.
0
rypinbubsAuthor Commented:
Can you post an example please tommyBoy?
0
Tom BeckCommented:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
    <title>Untitled</title>
    <style type="text/css">
    td.tdBlueHover:hover {background-color:#D4EDFF}
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:Calendar ID="Calendar1" runat="server" OnDayRender="Calendar1_DayRender"></asp:Calendar>
        </div>
    </form>
</body>
</html>

Open in new window


DayRender event:
protected void Calendar1_DayRender(object sender, DayRenderEventArgs e)
        {
            if (!e.Day.IsOtherMonth)
            {
                e.Cell.Attributes.Add("class", "tdBlueHover");
            }
            e.Cell.Style.Add("cursor", "pointer");
        }

Open in new window

0

Experts Exchange Solution brought to you by

Your issues matter to us.

Facing a tech roadblock? Get the help and guidance you need from experienced professionals who care. Ask your question anytime, anywhere, with no hassle.

Start your 7-day free trial
Get your problem seen by more experts

Be seen. Boost your question’s priority for more expert views and faster solutions

rypinbubsAuthor Commented:
Thanks tommyBoy, I think we're on the right track.
However, I still need the ability to select the cell itself.

If anywhere else in the cell is clicked I need to handle that as well.

I added the line
e.Cell.Attributes.Add("OnClick", e.SelectUrl);

but then this just gives me the same original problem:
string cntrlname = Page.Request.Params.Get("__EVENTTARGET");
says that it was calendar1 that was clicked when a link is actually clicked.
0
rypinbubsAuthor Commented:
Found a solution.
I changed the linkbutton attribute from
link.Attributes.Add("href", "javascript:__doPostBack('" + link.ID + "','')");

to

link.Attributes.Add("OnClick", "javascript:__doPostBack('" + link.ID + "','')");

Thanks for your help tommyBoy!!!
0
Tom BeckCommented:
Thanks.

On a side note, that "OnClick" should be all lower case.
0
It's more than this solution.Get answers and train to solve all your tech problems - anytime, anywhere.Try it for free Edge Out The Competitionfor your dream job with proven skills and certifications.Get started today Stand Outas the employee with proven skills.Start learning today for free Move Your Career Forwardwith certification training in the latest technologies.Start your trial today
ASP.NET

From novice to tech pro — start learning today.

Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.