2011-11-20 18 views
6

Ho una casella combinata in un ModalPopupExtender e quando viene visualizzato il popup l'elenco degli elementi non si trova sotto la casella di testo ma è sfalsato a destra. il mio codice è:ASP.Net Ajax ComboBox in ModalPopup

<asp:ScriptManager ID="ScriptManager1" runat="server" EnableScriptGlobalization="true"> 
     <Services> 
     </Services> 
     <Scripts> 
      <asp:ScriptReference Path="~/JavaScript/ScriptManager.js" /> 
     </Scripts> 
</asp:ScriptManager> 

<div> 
    <asp:Panel ID="dialog" runat="server"> 
     <div id="dialogContents"> 
      <asp:ComboBox ID="DropDownListMailTos" runat="server" AutoPostBack="true" 
       DropDownStyle="DropDown" Width="90%" RenderMode="Block"> 
       <asp:ListItem Text="1" Value="1" /> 
       <asp:ListItem Text="2" Value="2" /> 
       <asp:ListItem Text="3" Value="3" /> 
      </asp:ComboBox> 
      <br /> 
      <asp:Button ID="btnOK" Text="OK" runat="server" /> 
     </div> 
    </asp:Panel> 

    <asp:Button ID="btnShow" Text="Open Dialog" runat="server" /> 

    <asp:ModalPopupExtender 
     TargetControlID="btnShow" 
     PopupControlID="dialog" 
     OkControlID="btnOK" 
     DropShadow="true" 
     BackgroundCssClass="modalBackground" 
     runat="server" /> 
</div> 

ho provato alcune soluzioni trovate here e here

ma senza fortuna lì. Cosa posso fare a riguardo?

risposta

7

Sembra che l'unico problema qui sia che lo ModalPopup si scontrano con lo stile predefinito dello ComboBox. Hai solo bisogno di giocare con la classe CSS applicata agli ListItem s nello ComboBox per far sì che vengano visualizzati correttamente. Aggiungere il seguente codice al vostro CSS per quella pagina (testato in IE9, Chrome e Firefox) e si dovrebbe essere buono:

.ajax__combobox_itemlist 
{ 
    position:fixed !important; 
} 

Per ulteriori informazioni, vedere la sezione "Casella combinata Theming" in fondo lo documentation page.

+0

Oh, ottima soluzione – Vladimirs