Click here to Skip to main content
15,041,548 members
Please Sign up or sign in to vote.
1.00/5 (1 vote)
See more:
i am using ajaxToolkit:CalendarExtender in my appliction. now the problem is that it is not showing all the dates,dates after 20 is not visible. i don't know what is the problem,is any css problem or something else.

kindly help me to overcome from this problem. thanks in advance. my html code is
ASP.NET
<body>
<form id="form1" runat="server">
    <ajaxToolkit:ToolkitScriptManager ID="ToolkitScriptManager1"  runat="server"></ajaxToolkit:ToolkitScriptManager>
    <div>
        <span style="font-family: Segoe UI Light; font-size: 26pt;">Consolidated Trial Balance</span>
        <div class="body">
            <div>
                <ul style="list-style: none;">
                    <li>
                        <div class="col1">
                            <span>From Date</span>
                        </div>
                    </li>
                    <li>
                        <div class="col2">
                            <asp:TextBox ID="txtFromDate" runat="server" Width="130"></asp:TextBox>
<asp:ImageButton ID="imgbtnFromDate" runat="server" Height="25" Width="25" ImageUrl="~/images/Calendar_scheduleHS.png" Style="position: relative; left: 10px; bottom: -8px;" />
                            <ajaxToolkit:CalendarExtender ID="CalendarExtender1"
                                PopupButtonID="imgbtnFromDate"
                                TargetControlID="txtFromDate"
                                Format="dd/MM/yyyy"
                                 runat="server"
                                CssClass="calender">
                            </ajaxToolkit:CalendarExtender>

                        </div>
                    </li>
<li>

                        <div class="col1">
                            <span>To Date</span>
                        </div>
                    </li>
<li>
                        <asp:TextBox ID="txtToDate" runat="server" Width="130"></asp:TextBox>
 <asp:ImageButton ID="imgbtnToDAte" runat="server" Height="25" Width="25" ImageUrl="~/images/Calendar_scheduleHS.png" Style="position: relative; left: 10px; bottom: -8px;" />
                        <ajaxToolkit:CalendarExtender ID="CalendarExtender2"
                            PopupButtonID="imgbtnToDAte"
                            TargetControlID="txtToDate"
                            Format="dd/MM/yyyy"
                             runat="server"
                            CssClass="calender">
                        </ajaxToolkit:CalendarExtender>

                    </li>
                </ul>

            </div>
 <div style="margin-removed 450px; margin-removed 40px;">
                <ul style="list-style: none;">
                    <li>
                        <asp:Button ID="btnCancel" runat="server" CssClass="button" Text="Cancel" />
                    </li>
                    <li>
                        <asp:Button ID="btnReset" runat="server" CssClass="button" Text="Reset" OnClick="btnReset_Click" />
                    </li>
                    <li>
                        <asp:Button ID="btnGenerate" runat="server" CssClass="button" Text="Generate" OnClientClick="if(!CompareDates()) return false;" OnClick="btnGenerate_Click" />
                    </li>
                </ul>
            </div>
</div>

    </div>
</form>


and my css is like
CSS
body {
       font-family: 'Segoe UI';
       color: #444;
   }

   .body {
       width: auto;
       margin-top: 50px;
   }

   ul li {
       display: inline-block;
       margin-left: 10px;
   }

   .button {
       width: 80px;
       height: 30px;
   }
.col1 {
       width: 80px;
   }

   .col2 {
       width: 300px;
   }
Posted

Hai
Pls try in different browser,may below control hide that dates,try to test in sample page only calender extender.


I have test ur html code in my system,i am get whole date in each month,pls check calender separately and reply .
   
v2
i added simple css and its running well.
CSS
.MyCalendar .ajax__calendar_container {
            border: 1px solid #646464;
            background-color: lemonchiffon;
            color: red;
        }

            .MyCalendar .ajax__calendar_container th {
                padding: 0px;
            }

            .MyCalendar .ajax__calendar_container td {
                background-color: lemonchiffon;
                padding: 0px;
            }

        .MyCalendar .ajax__calendar_other .ajax__calendar_day, .MyCalendar .ajax__calendar_other .ajax__calendar_year {
            color: black;
        }

        .MyCalendar .ajax__calendar_hover .ajax__calendar_day, .MyCalendar .ajax__calendar_hover .ajax__calendar_month, .MyCalendar .ajax__calendar_hover .ajax__calendar_year {
            color: black;
        }

        .MyCalendar .ajax__calendar_active .ajax__calendar_day, .MyCalendar .ajax__calendar_active .ajax__calendar_month, .MyCalendar .ajax__calendar_active .ajax__calendar_year {
            color: black;
            font-weight: bold;
        }
   

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900