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。

我尝试使用width inherit和auto，但它没有效果。我尝试在模式弹出窗口中为div添加一个值，但这会在gridview列宽度中产生问题，因此我将该选项排除在外。我认为将宽度设置为auto或者其他东西的方式可能有问题，但我找不到它。

另外，我使用IE7（公司限制）

Answer 1

很难理解你得到了什么以及你想要得到什么。一些屏幕截图会有很大帮助。与此同时：

该模式位于gridview
中

我不会在modalpopupextender内加gridview。

问题是弹出窗口的内容会在gridview中的每一行重复出现，这会产生大量代码来处理所有这些弹出窗口。另请注意，面板中的所有html和图像都会加载到页面中，即使它们未显示也是如此。

我建议你将扩展器放在gridview之外。要处理这个问题，您需要做很多修改。在sumarry中，您将gridview作为asyncpostbacktrigger更新面板的pnlImage。设置TargetControlID to a hidden button so you could show your ModalPopupExtender from Code behind。通过linkbuton替换你的lbName，并在gGridView_RowCommand事件中设置为命令，并使用e.CommandName和e.CommandArgument手动绑定代码后面的模态弹出窗口中的控件，你可以使用如果您不想手动处理所有内容，则转发器或绑定到仅返回一个项目的数据源的数据列表。

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

Answer 2

我不明白为什么，但那段代码对我有用：

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

Ajax ModalPopup宽度问题

2 个答案: