2011-04-21 38 views
2

我的頁面中有一個modalpopupextender。該模式在gridview。它工作正常,唯一的問題是它的寬度在屏幕的90%左右。我不想硬編碼width(這有效),因爲由於文本長度可以改變,它可能會離開面板,這不是很好看。Ajax ModalPopup寬度問題

<div runat="server"> 
    <asp:ModalPopupExtender ID="ModalPopupInfo" runat="server" 
     CancelControlID="btnClose" OnCancelScript="HideModalPopup()" 
     TargetControlID="lbName" PopupControlID="pnlInfo" Drag="True" 
     BackgroundCssClass="ModalPopupBg" DynamicServicePath="" Enabled="True"/> 
</div> 
<asp:LinkButton ID="lbName" runat="server" ></asp:LinkButton> 
<div style="width:inherit;"> 
<asp:Panel ID="pnlInfo" runat="server" Font-Names="Times New Roman" UpdateMode="Conditional" EnableViewState="true" style="display:none; background-color:#FFFFFF; padding:20px; margin:50px; border:3px solid #4B0303; color:Black; width:auto;" > 
    <div runat="server" class="divTable" style="width:inherit;"> 
     <div runat="server" class="divRow" style="text-align:center; width:300px; float:left;"> 
      <asp:UpdatePanel ID="pnlImage" runat="server" UpdateMode="Conditional"> 
       <ContentTemplate> 
        <asp:Accordion ID="Accordion" runat="server" FadeTransitions="true" FramesPerSecond="40" TransitionDuration="250" AutoSize="None" SelectedIndex="-1" RequireOpenedPane="false" SuppressHeaderPostbacks="true" Height="50px" Width="360px" Enabled= "false"> 
         <Panes> 
          <asp:AccordionPane ID="AccordionPane" runat="server"> 
           <Header> 
            <asp:Image ID="imgUser" runat="server" ImageAlign="Middle" Width="100px" Height="100px" EnableViewState="true"/> 
            <asp:Label ID="lblUsrCode" runat="server" Visible="false" Text='<%# Eval("usr_cd") %>'></asp:Label> 
           </Header> 
           <Content> 
            <asp:AsyncFileUpload ID="AsyncFileUpload" runat="server" OnUploadedComplete="OnUpdateComplete" /> 
           </Content> 
           </asp:AccordionPane> 
          </Panes> 
         </asp:Accordion> 
       </ContentTemplate> 
       <Triggers> 
        <asp:AsyncPostBackTrigger ControlID="lbUpdate" EventName="Click"/> 
       </Triggers> 
      </asp:UpdatePanel> 
      <asp:UpdatePanel runat="server" UpdateMode="Always"> 
       <ContentTemplate> 
        <asp:LinkButton ID="lbUpdate" runat="server" Visible="false" OnClick="lbUpdate_Click" OnClientClick="__doPostBack('pnlImage', '');"/> 
       </ContentTemplate> 
      </asp:UpdatePanel> 
     </div><br /><br /> 
    </asp:Panel> 
</div> 

有一個在ASP面板更多的代碼,但由於它只是更divslinkbuttons它是不是這個問題很重要。

我試着把寬度繼承和自動,但它沒有效果。我試圖在模式彈出窗口的div中添加一個值,但是在gridview列的寬度中產生了問題,所以我排除了這個選項。我認爲我將寬度設置爲auto或某些東西的方式可能有問題,但我無法找到它。

而且,我使用IE7(公司限制)

回答

0

我不明白爲什麼,但該代碼爲我工作:

<asp:GridView runat="server" AutoGenerateColumns="False" CellPadding="4" Font-Bold="False" 
       ForeColor="#333333" ID="gvData" BorderColor="#333333" AllowSorting="True" OnSorting="gvData_Sorting" 
       OnRowDataBound="gvData_RowDataBound" ShowHeaderWhenEmpty="True" 
       AllowPaging="true" PageSize="50" 
       Width="625px" SelectedIndex="0" 
       onpageindexchanged="gvData_PageIndexChanged" onpageindexchanging="gvData_PageIndexChanging" meta:resourcekey="gvDataResource1" 
       > 
       <AlternatingRowStyle HorizontalAlign="Left" BackColor="White"></AlternatingRowStyle> 
       <Columns> 
        <asp:TemplateField HeaderText="Name" SortExpression="disp_nm" 
         AccessibleHeaderText="Name" ItemStyle-Wrap="False" 
         ItemStyle-Width="190px" HeaderStyle-Width="190px" meta:resourcekey="TemplateFieldResource1" 
         > 
         <ItemTemplate> 
          <asp:ModalPopupExtender ID="ModalPopupInfo" runat="server" 
           CancelControlID="btnClose" OnCancelScript="HideModalPopup()" 
           TargetControlID="lbName" PopupControlID="pnlInfo" Drag="True" 
           BackgroundCssClass="ModalPopupBg" DynamicServicePath="" Enabled="True"/> 
          <asp:LinkButton ID="lbName" runat="server" ></asp:LinkButton> 
          <asp:Panel ID="pnlInfo" runat="server" Font-Names="Times New Roman" UpdateMode="Conditional" EnableViewState="true" 
           style="display:none; background-color:#FFFFFF; padding:20px; margin:50px; border:3px solid #4B0303; color:Black; 
           width:350px;position:absolute;" 
           > 
           <div runat="server" class="divTable" style="width:350px;"> 

            <div runat="server" class="divRow" style="text-align:center; width:auto; float:none;"> 
0

很難明白你得到什麼,你正試圖獲得。一些屏幕截圖將極大地幫助。同時:

情態是在gridview

我不會把一個modalpopupextender一個gridview內。

問題在於你的gridview中的每一行都會重複彈出窗口的內容,這會產生大量代碼來處理所有這些彈出窗口。還要注意,面板中的所有html和圖像都會加載到頁面中,即使它們沒有顯示。

我建議你把你的擴展器放在gridview之外。爲了解決這個問題,你需要做很多修改。在sumarry中,您將gridview設爲pnlImage更新面板的asyncpostbacktrigger。設置TargetControlID to a hidden button so you could show your ModalPopupExtender from Code behind。通過鏈接替換您的lbName並將其設置爲gGridView_RowCommand事件中的命令,並使用e.CommandNamee.CommandArgument手動綁定代碼背後的模式彈出窗口中的控件,您可以使用中繼器或數據綁定到僅返回數據源的數據源一個項目,如果你不想手動處理所有的事情。

這樣,你的代碼將會更加有效,你將能夠使用你排除的選項。