Question

目前我有一个带有gridview的aspx页面。我想添加一个prettyPhoto弹出窗口，它出现在gridview中的按钮单击上。弹出窗口将包含所选行的详细信息。我的gridview看起来像这样：

  <asp:GridView ID="gvBacklog" runat="server" AutoGenerateColumns="false" DataKeyNames="BacklogID" CssClass="table table-striped table-bordered table-condensed table-responsive" DataSourceID="ldsBacklog" AllowPaging="true" AllowSorting="true">
                    <Columns>
                        <asp:BoundField DataField="BacklogID" HeaderText="Backlog ID" SortExpression="BacklogID" />
                        <asp:TemplateField HeaderText="User Story" SortExpression="Story.StoryName">
                            <ItemTemplate>
                                <%#Eval("Story.StoryName") %>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <itemtemplate>
                                    <asp:TextBox Id="txtStoryName" runat="server" Text='<%#Bind("Story.StoryName")%>'></asp:TextBox>
                                </itemtemplate>
                            </EditItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Description" SortExpression="Story.StoryDesc">
                            <ItemTemplate>
                                <%#Eval ("Story.StoryDesc") %>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <itemtemplate>
                                    <asp:TextBox Id="txtDesc" runat="server" Text='<%#Bind("Story.StoryDesc")%>'></asp:TextBox>
                                </itemtemplate>
                            </EditItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Story Points" SortExpression="Story.StoryPoints">
                            <ItemTemplate>
                                <%#Eval ("Story.StoryPoints") %>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:DropDownList ID="ddlFibbonacci" runat="server" SelectedValue='<%#Bind("Story.StoryPoints")%>'>
                                    <asp:ListItem>0</asp:ListItem>
                                    <asp:ListItem>1</asp:ListItem>
                                    <asp:ListItem>2</asp:ListItem>
                                    <asp:ListItem>3</asp:ListItem>
                                    <asp:ListItem>5</asp:ListItem>
                                    <asp:ListItem>8</asp:ListItem>
                                    <asp:ListItem>13</asp:ListItem>
                                    <asp:ListItem>20</asp:ListItem>
                                    <asp:ListItem>40</asp:ListItem>
                                    <asp:ListItem>100</asp:ListItem>
                                </asp:DropDownList>
                            </EditItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Size" SortExpression="Story.Size">
                            <ItemTemplate>
                                <%#Eval ("Story.Size") %>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="WSJF Score" SortExpression="Story.WSJFScore">
                            <ItemTemplate>
                                <%#Eval ("Story.WSJFScore") %>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Sprint" SortExpression="Sprint.SprintNumber">
                            <ItemTemplate>
                                <%#Eval("Sprint.SprintNumber") %>
                            </ItemTemplate>
                            <EditItemTemplate>
                                <asp:DropDownList ID="ddlSprint" DataSourceID="ldsSprint" DataValueField="SprintNumber" SelectedValue='<%#Bind("Sprint.SprintNumber") %>' runat="server"></asp:DropDownList>
                            </EditItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField HeaderText="Added By" SortExpression="User.Username">
                            <ItemTemplate>
                                <%#Eval ("User.Username") %>
                            </ItemTemplate>
                        </asp:TemplateField>
                        <asp:TemplateField>
                            <ItemTemplate>
                                <asp:LinkButton ID="lbEdit" runat="server" CssClass="btn btn-default">
                                    <span class="glyphicon glyphicon-pencil"></span>
                                </asp:LinkButton>
                                <asp:LinkButton ID="lbDelete" runat="server" CssClass="btn btn-default" CommandName="Delete">
                                    <span class="glyphicon glyphicon-remove"></span>
                                </asp:LinkButton>
                            </ItemTemplate>
                        </asp:TemplateField>
                    </Columns>
                </asp:GridView>

任何提示或建议都会非常有用！我看过网上似乎找不到任何东西。

Answer 1

从gridview执行弹出窗口是一项棘手的工作。选择行的行为会导致回发，这会对尝试管理客户端弹出代码造成严重破坏。你必须做一些箍跳，以便在回发完成后弹出窗口。但导致回发类型的目的是打破使用弹出窗口的目的。

因此，处理此问题的一种方法是确保初始传递中的所有详细信息都可用。您可以通过在嵌入当前GridView中的新模板字段或现有模板字段中的隐藏div中嵌入DetailsView（使用当前行中的键填充它自己的数据源）来完成此操作。

或者，如果您对回发没问题，只需将当前页面上包含DetailsView的隐藏div放在其他所有内容之下，然后找出逻辑以在帖子完成后显示现在填充的DV。

Answer 2

我使用Bootstrap模式来实现该功能。

<div class="modal fade">
  <div class="modal-dialog">
   <div class="modal-content">
     <div class="modal-header">
       <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
    <h4 class="modal-title">Modal title</h4>
  </div>
  <div class="modal-body">
    <p>One fine body&hellip;</p>
  </div>
  <div class="modal-footer">
    <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
    <button type="button" class="btn btn-primary">Save changes</button>
  </div>
</div><!-- /.modal-content -->

$('#exampleModal').on('show.bs.modal', function (event) {
  var button = $(event.relatedTarget) // Button that triggered the modal
})

在GridView按钮上单击打开带有aspx页面的prettyPhoto弹出窗口

2 个答案: