Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
?
Solved

asp.net C# dynamically created table doesn't display correctly

Posted on 2010-11-29
5
Medium Priority
?
892 Views
Last Modified: 2012-05-10
Hi all,

I'm trying to create a dynamically create a calendar table. I know there is an asp calendar control however I need to do it this way.
my issue is I set height and width of the table to 100% but when it renders only width is 100%
Here is the code to generate it:
 
protected Table BuildCalendar()
    {
        Table tblCal = new Table();
        tblCal.Attributes.Add("cellspacing","1");
        tblCal.Attributes.Add("height", "100%");
        tblCal.Attributes.Add("width", "100%");
        tblCal.Attributes.Add("border", "1");
        //tblCal.Height = System.Web.UI.WebControls.Unit.Percentage(100);
        //tblCal.Width = System.Web.UI.WebControls.Unit.Percentage(100);
        

        //previous month hyperlink and cell
        TableHeaderCell hdrPrevMonth = new TableHeaderCell();
        HyperLink hyprPrevMonth = new HyperLink();
        hyprPrevMonth.ImageUrl = "images/arrow_left.gif";
        hyprPrevMonth.NavigateUrl = "calendar.aspx?M=" + DateAndTime.Month(DateAndTime.DateAdd("M", -1, theCalendarDate)) + "&D=1&Y=" + DateAndTime.Year(DateAndTime.DateAdd("M", -1, theCalendarDate));
        hdrPrevMonth.Controls.Add(hyprPrevMonth);

        //Month name and year cell
        TableHeaderCell hdrMonthName = new TableHeaderCell();
        hdrMonthName.ColumnSpan = 5;
        hdrMonthName.Text = theCalendarDate.ToString("MMMM") + " " + theCalendarDate.Year;

        //Next month hyperlink and cell
        TableHeaderCell hdrNextMonth = new TableHeaderCell();
        HyperLink hyprNextMonth = new HyperLink();
        hyprNextMonth.ImageUrl = "images/arrow_right.gif";
        hyprNextMonth.NavigateUrl = "calendar.aspx?M=" + DateAndTime.Month(DateAndTime.DateAdd("M", 1, theCalendarDate)) + "&D=1&Y=" + DateAndTime.Year(DateAndTime.DateAdd("M", 1, theCalendarDate));
        hdrNextMonth.Controls.Add(hyprNextMonth);

        //adding cells to Month hearder row
        TableHeaderRow hdrMonthRow = new TableHeaderRow();
        hdrMonthRow.CssClass = "CalendarMonth";
        hdrMonthRow.Cells.Add(hdrPrevMonth);
        hdrMonthRow.Cells.Add(hdrMonthName);
        hdrMonthRow.Cells.Add(hdrNextMonth);

        //Add header month header row to table
        tblCal.Rows.Add(hdrMonthRow);

        //Week days header row
        TableHeaderRow hdrDaysRow = new TableHeaderRow();
        string[] strDaysArray = new string[7] {"Sun", "Mon", "Tue", "Wed", "Thu", "Fri", "Sat"};
        
        //Building Header cells for days of the week and adding to days header row
        foreach (string day in strDaysArray)
        {
            TableHeaderCell hdrDay = new TableHeaderCell();
            hdrDay.CssClass = "CalendarDays";
            hdrDay.Text = day;
            hdrDaysRow.Cells.Add(hdrDay);
        }

        //add days header row to table
        tblCal.Rows.Add(hdrDaysRow);

        //Building Calender date days
        do
        {
            TableRow tr = new TableRow();

            for (int Z = 1; Z <= 7; Z++)
            {
                TableCell tc = new TableCell();
                if (DateAndTime.Month(theRunningCalendarDate) == theCalendarMonth)
                {
                    int Y = DateAndTime.Weekday(theRunningCalendarDate, Microsoft.VisualBasic.FirstDayOfWeek.Sunday);
                    if (Y == 1 || Y == 7)
                    {
                        theCalendarBackcolor = "#edf2f8";
                    }
                    else
                    {
                        theCalendarBackcolor = "#FFFFFF";
                    }

                    if (DateAndTime.Day(theRunningCalendarDate) == theCalendarDay)
                    {
                        theCalendarBackcolor = "#979e51";
                    }
                }
                else
                {
                    theCalendarBackcolor = "#EBEBEB";
                }

                thePrintedDay = DateAndTime.Day(theRunningCalendarDate).ToString();
                if (theRunningCalendarDate == Convert.ToDateTime(DateAndTime.MonthName(DateAndTime.Month(DateTime.Now), false) + " " + DateAndTime.Day(DateTime.Now) + ", " + DateAndTime.Year(DateTime.Now)))
                {
                    thePrintedDay = "<b>" + thePrintedDay + "</b>";
                }

                theRunningCalendarDate = DateAndTime.DateAdd("d", 1, theRunningCalendarDate);
                tc.Style.Add("cursor", "hand");
                tc.BackColor = System.Drawing.Color.FromName(theCalendarBackcolor);
                tc.Width = System.Web.UI.WebControls.Unit.Percentage(14);
                tc.VerticalAlign = VerticalAlign.Top;
                tc.Text = thePrintedDay;

                tr.Cells.Add(tc);
            }
            tblCal.Rows.Add(tr);
        } while (theRunningCalendarDate <= (Convert.ToDateTime(DateAndTime.MonthName(theCalendarMonth, true) + " " + theLastDay + ", " + theCalendarYear)));

        return tblCal;
    }

Open in new window


When it renders it look like this:
  Cal
I need to look like this:
 Cal3
I will include the style sheet even though I don't think there is any thing in there that would over ride the height.
 Style.css

thanks for the help.
0
Comment
Question by:iftech
  • 3
  • 2
5 Comments
 
LVL 52

Expert Comment

by:Carl Tawn
ID: 34231052
Height of 100% means 100% of the height of the parent element, not necessarily the height of the page. It's impossible to say what you need to change without seeing the table markup in context.
0
 

Author Comment

by:iftech
ID: 34231220
thanks but there is nothing but a placeholder. here it is.
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Calendar.aspx.cs" Inherits="Calendar" %>

<!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>Calendar</title>
    <link href="Style.css" rel="stylesheet" type="text/css" />
</head>
<body style="background-color:#FFFFFF; color:#000000; margin-top:0; margin-left:0" >
    <form id="form1" runat="server">
        <asp:PlaceHolder ID="plcCal" runat="server" />      
    </form>
</body>
</html>
0
 

Author Comment

by:iftech
ID: 34231445
This might help as well ; )



<html xmlns="http://www.w3.org/1999/xhtml">

<head><title>

      Calendar

</title><link href="Style.css" rel="stylesheet" type="text/css" /></head>

<body style="background-color:#FFFFFF; color:#000000; margin-top:0; margin-left:0" >

    <form name="form1" method="post" action="calendar.aspx?M=12&amp;D=1&amp;Y=2010" id="form1">

<div>

<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMTEyMDI3NDAzMmRkMy01A3FJ94tj7Plzro9o8HJIr/0=" />

</div>



        <table cellspacing="0" border="1" border="0" style="height:100%;width:100%;">

      <tr class="CalendarMonth">

            <th><a href="calendar.aspx?M=11&amp;D=1&amp;Y=2010"><img src="images/arrow_left.gif" style="border-width:0px;" /></a></th><th colspan="5">December 2010</th><th><a href="calendar.aspx?M=1&amp;D=1&amp;Y=2011"><img src="images/arrow_right.gif" style="border-width:0px;" /></a></th>

      </tr><tr>

            <th class="CalendarDays">Sun</th><th class="CalendarDays">Mon</th><th class="CalendarDays">Tue</th><th class="CalendarDays">Wed</th><th class="CalendarDays">Thu</th><th class="CalendarDays">Fri</th><th class="CalendarDays">Sat</th>

      </tr><tr>

            <td valign="top" style="background-color:#EBEBEB;">28</td><td valign="top" style="background-color:#EBEBEB;"><b>29</b></td><td valign="top" style="background-color:#EBEBEB;">30</td><td valign="top" style="background-color:#979e51;">1</td><td valign="top" style="background-color:#FFFFFF;">2</td><td valign="top" style="background-color:#FFFFFF;">3</td><td valign="top" style="background-color:#edf2f8;">4</td>

      </tr><tr>

            <td valign="top" style="background-color:#edf2f8;">5</td><td valign="top" style="background-color:#FFFFFF;">6</td><td valign="top" style="background-color:#FFFFFF;">7</td><td valign="top" style="background-color:#FFFFFF;">8</td><td valign="top" style="background-color:#FFFFFF;">9</td><td valign="top" style="background-color:#FFFFFF;">10</td><td valign="top" style="background-color:#edf2f8;">11</td>

      </tr><tr>

            <td valign="top" style="background-color:#edf2f8;">12</td><td valign="top" style="background-color:#FFFFFF;">13</td><td valign="top" style="background-color:#FFFFFF;">14</td><td valign="top" style="background-color:#FFFFFF;">15</td><td valign="top" style="background-color:#FFFFFF;">16</td><td valign="top" style="background-color:#FFFFFF;">17</td><td valign="top" style="background-color:#edf2f8;">18</td>

      </tr><tr>

            <td valign="top" style="background-color:#edf2f8;">19</td><td valign="top" style="background-color:#FFFFFF;">20</td><td valign="top" style="background-color:#FFFFFF;">21</td><td valign="top" style="background-color:#FFFFFF;">22</td><td valign="top" style="background-color:#FFFFFF;">23</td><td valign="top" style="background-color:#FFFFFF;">24</td><td valign="top" style="background-color:#edf2f8;">25</td>

      </tr><tr>

            <td valign="top" style="background-color:#edf2f8;">26</td><td valign="top" style="background-color:#FFFFFF;">27</td><td valign="top" style="background-color:#FFFFFF;">28</td><td valign="top" style="background-color:#FFFFFF;">29</td><td valign="top" style="background-color:#FFFFFF;">30</td><td valign="top" style="background-color:#FFFFFF;">31</td><td valign="top" style="background-color:#EBEBEB;">1</td>

      </tr>

</table>      

    </form>

</body>

</html>
0
 
LVL 52

Accepted Solution

by:
Carl Tawn earned 2000 total points
ID: 34231831
Try adding a 100% height to both the <body> and <form> elements as well. That should then give some the 100% on the table some meaning.  
0
 

Author Comment

by:iftech
ID: 34248897
No need to close anymore. It was resolved.
0

Featured Post

VIDEO: THE CONCERTO CLOUD FOR HEALTHCARE

Modern healthcare requires a modern cloud. View this brief video to understand how the Concerto Cloud for Healthcare can help your organization.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Calculating holidays and working days is a function that is often needed yet it is not one found within the Framework. This article presents one approach to building a working-day calculator for use in .NET.
Real-time is more about the business, not the technology. In day-to-day life, to make real-time decisions like buying or investing, business needs the latest information(e.g. Gold Rate/Stock Rate). Unlike traditional days, you need not wait for a fe…
Is your OST file inaccessible, Need to transfer OST file from one computer to another? Want to convert OST file to PST? If the answer to any of the above question is yes, then look no further. With the help of Stellar OST to PST Converter, you can e…
With just a little bit of  SQL and VBA, many doors open to cool things like synchronize a list box to display data relevant to other information on a form.  If you have never written code or looked at an SQL statement before, no problem! ...  give i…
Suggested Courses

579 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question