2012-08-27 13 views
8

sto usando un controllo extender calendario Ajax sulla mia pagina, e anche se il blocco extender viene visualizzato correttamente, il suo contenuto non lo fanno:Calendario Extender non visualizzare correttamente

Screenshot of CalendarExtender

Ecco il codice che sto usando per scrivere sulla pagina:

<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> 

non ci sono regole di stile applicati direttamente sulla CalendarExtender, ma ho questa css che può essere rilevante:

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

Qualcuno ha visto questo prima? Qualcuno sa cosa potrebbe essere?

Grazie in anticipo per qualsiasi aiuto!

EDIT
ho provato a rimuovere il galleggiante e anche se questo risolve il CalendarExtender, si sposta anche ogni cella nella tabella contenitore fuori allineamento. Ho anche provato a impostare clear: both; su CalendarExtender, ma questo fa sparire lo sfondo.

risposta

5

Ok ho capito fuori :)

Il problema è venuto con quel CSS per le celle della tabella. La modifica della larghezza delle celle ha anche modificato la larghezza delle celle all'interno della tabella che è stata scritta da Calender Extender.

Per aggirare il problema, ho rimosso tutti i carri allegorici sul tavolo ed è elementi figlio e ha dichiarato una nuova classe per impostare la larghezza che poi ho omesso dalla cella che contiene il calendario:

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

hai ancora problemi con esso, o è stato risolto ...? –

+0

@MayankPathak Questo è risolto, grazie :) la tua domanda mi fa chiedere se la risposta è abbastanza chiara ... – Ortund

3

ho avuto simili problemi con un estensore del calendario all'interno di un oggetto ListView. Stava tagliando sempre venerdì e sabato a causa di problemi di stile. Ho finito per aggirarlo avvolgendo i miei estensori del calendario (compresa la casella di testo e l'immagine) e assegnandogli uno stile che sovrascrive i css del mio tavolo.

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

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

quindi applicando l'id qui:

<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> 

Con questo metodo non è necessario cambiare lo stile per tutte le tabelle, e concentrarsi solo sul calendario in fastidiosi.

Problemi correlati