2012-08-27 7 views
8

Anzeigen Ich bin eine Ajax-Kalender Extendersteuerelement auf meiner Seite verwenden, und obwohl der Extender Block richtig angezeigt wird, dann ist es Inhalt nicht:Kalender Extender nicht richtig

Screenshot of CalendarExtender

Hier ist der Code ist ich bin indem es auf die Seite zu schreiben:

<table class="tblForm"> 
    <tr> 
     <td valign="top"> 
      <asp:TextBox runat="server" ID="txtPickupDate" AutoPostBack="true"></asp:TextBox> 
      <aj:CalendarExtender runat="server" ID="calPickup" TargetControlID="txtPickupDate" Format="yyyy-MM-dd"> 
      </aj:CalendarExtender> 
     </td> 
    </tr> 
</table> 

es gibt keine stil~~POS=TRUNC direkt auf die CalendarExtender angewendet, aber ich habe diese CSS haben, die relevant sein können:

.tblForm 
{ 
    display: block; 
} 
.tblForm td 
{ 
    width: 245px; 
    float: left; 
} 

Hat jemand das schon einmal gesehen? Weiß jemand was es sein könnte?

Vielen Dank im Voraus für jede Hilfe!

EDIT
Ich habe versucht, den Schwimmer zu entfernen, und obwohl dies die CalendarExtender fixiert, es verschiebt sich auch jede Zelle in der Behältertabelle aus der Ausrichtung. Ich habe auch versucht, clear: both; auf den CalendarExtender zu setzen, aber dadurch verschwindet der Hintergrund.

Antwort

5

Okay, ich gemustert es habe aus :)

Das Problem kam mit diesem CSS für die Tabellenzellen in. Durch das Ändern der Zellenbreite wurde auch die Breite der Zellen in der Tabelle geändert, die vom Calender Extender geschrieben wurde.

Um dies zu umgehen, entfernte ich alle Schwimmer auf dem Tisch und es ist Elemente Kind und erklärte, eine neue Klasse, die Breite einzustellen, die ich dann aus der Zelle den Kalender enthält weggelassen:

.tblForm 
{ 
    display: block; 
} 
.tblForm tr.wider td, tblForm .wider 
{ 
    width: 245px; 
} 
+0

haben Sie immer noch ein Problem damit, oder es ist gelöst ...? –

+0

@MayankPathak Dies ist gelöst, danke :) Ihre Frage lässt mich fragen, ob die Antwort klar genug ist ... – Ortund

3

ich ähnlich hatte Probleme mit einem Kalendererweiterung innerhalb eines ListView-Objekts. Es fiel immer Freitag und Samstag aufgrund von Styling-Problemen. Ich bin damit fertig geworden, indem ich meine Kalender-Extender (einschließlich der Textbox und des Bildes) eingewickelt habe und ihnen einen Stil zugewiesen habe, der die CSS-Tabelle meiner Tabelle außer Kraft setzt.

#calendarContainerOverride table 
{ 
    width:0px; 
    height:0px; 
} 

#calendarContainerOverride table tr td 
{ 
    padding:0; 
    margin:0; 
} 

Anwendung dann die ID hier:

<tr id="calendarContainerOverride"> 
    <td style="padding-top:10px">  
    <asp:TextBox ID="txtStart" runat="server" %>' /> 
    <asp:CalendarExtender ID="extender" runat="server" Enabled="True" TargetControlID="txtStart" PopupButtonID="imgCalendarStart" /> 
    <asp:Image ID="imgCalendarStart" ImageUrl="~/Images/Calendar.png" runat="server"/> 
    </td> 
</td> 

Mit dieser Methode müssen Sie das Styling für alle Ihre Tabellen nicht ändern, und nur auf dem nervigen Kalender konzentrieren.