Ajax ModalPopup宽度问题

Question

我的一个页面中有一个modalpopupextender。该模式位于gridview中。它工作得很好，唯一的问题是它的宽度大约是屏幕的90%。我不想硬编码一个width (可以工作)，因为由于文本长度可以改变，它可能会离开面板，这是不是真的很好看。

<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面板中有更多的代码，但这对这个问题并不重要，因为它只是更多的divs和linkbuttons。

我试着把宽度继承和自动，但它没有效果。我尝试在div中将一个值放在模式弹出窗口上，但这会在gridview列的宽度上产生问题，所以我排除了这个选项。我想可能是我将宽度设置为自动的方式有问题，但我就是找不到它。

另外，我使用的是IE7 (公司限制)

Answer 1

我不明白为什么，但这些代码对我来说很有效：

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

Answer 2

很难理解你想要得到什么和你想要得到什么。一些截图会有很大的帮助。同时：

模式在gridview中的

我不会在gridview中放入modalpopupextender。

问题是gridview中的每一行都会重复弹出窗口的内容，这会生成大量代码来处理所有这些弹出窗口。还要注意，面板中的所有html和图像都会加载到页面中，即使它们没有显示。

我建议您将扩展器放在gridview之外。要处理这一点，您需要做许多修改。总之，您将gridview作为pnlImage更新面板的asyncpostbacktrigger。设置TargetControlID to a hidden button so you could show your ModalPopupExtender from Code behind。用一个链接按钮替换你的lbName并将其设置为gGridView_RowCommand事件中的一个命令，并使用e.CommandName和e.CommandArgument在后面的代码中手动绑定模式弹出窗口中的控件，如果你不想手动处理所有的事情，你可以使用一个中继器或一个数据列表来绑定到一个只返回一项的数据源。

这样，您的代码将更加有效，并且您将能够使用您排除的选项。