当自动回发时,网页会跳到顶部

时间:2014-01-08 05:05:27

标签: c# asp.net gridview autopostback

当我在网格视图中选中某个复选框时,我遇到了问题,页面本身将跳回到顶部而不是在自动回发时停留在相同的位置。以下是我设置网格视图的方法:

<UpdatePanel ID="UpdatePanel1" runat="server">
<ContentTemplate>
<asp:Repeater ID="Repeater1" runat="server" OnItemDataBound="Repeater1_ItemDataBound">
                    <ItemTemplate>
                        <!-- COLLAPSIBLE PANEL EXTENDER -->
                        <asp:Panel ID="pHeader1" runat="server" CssClass="cpHeader">
                            <!-- Collapsible panel extender header -->
                            <div class="form-group" style="background-color: #ffb848; height: 30px; vertical-align: middle">
                                <div class="col-md-3">
                                    <div style="float: left; color: White; padding: 5px 5px 0 0">
                                        <asp:Label ID="lblCategory" Text='<%# DataBinder.Eval(Container.DataItem, "categoryName") %>' runat="server" />
                                    </div>
                                </div>
                                <div class="col-md-9">
                                    <div style="float: right; color: White; padding: 5px 5px 0 0">
                                        <asp:Label ID="lblHeaderText1" runat="server" />
                                    </div>
                                </div>
                                <div style="clear: both"></div>
                            </div>
                        </asp:Panel>
                        <!-- Collapsible panel extender body -->
                        <asp:Panel ID="pBody1" runat="server" CssClass="cpBody">
                            <asp:Label ID="lblBodyText1" runat="server" />
                            <!-- Grid view to show products based on each category -->
                            <asp:GridView ID="gvProduct" runat="server" AutoGenerateColumns="False" Width="998px" CellPadding="4" ForeColor="#333333" GridLines="None" ShowHeader="False" DataKeyNames="id">
                                <AlternatingRowStyle BackColor="White" ForeColor="#284775" />
                                <Columns>
                                    <asp:TemplateField ItemStyle-HorizontalAlign="Center">
                                        <ItemTemplate>
                                            <asp:CheckBox ID="cbCheckRow" runat="server" AutoPostBack="true"/>
                                        </ItemTemplate>
                                    </asp:TemplateField>
                                    <asp:BoundField DataField="name" HeaderText="Name" ItemStyle-Width="650px" />
                                    <asp:BoundField DataField="inventoryQuantity" HeaderText="Total Unit" />
                                    <asp:TemplateField HeaderText="Quantity" ItemStyle-HorizontalAlign="Center" ItemStyle-Width="200px">
                                        <ItemTemplate>
                                            <asp:TextBox ID="tbQuantity" runat="server" Width="40" Text="0" OnTextChanged="tbQuantity_TextChanged" AutoPostBack="true"/>
                                            <asp:Label ID="lblCheckAmount" runat="server" ForeColor="#a94442"></asp:Label>
                                        </ItemTemplate>
                                    </asp:TemplateField>

                                </Columns>
                                <EditRowStyle BackColor="#999999" />
                                <FooterStyle BackColor="#5D7B9D" Font-Bold="True" ForeColor="White" />
                                <HeaderStyle BackColor="#ffb848" ForeColor="White" />
                                <PagerStyle BackColor="#d8d8d8" ForeColor="#333333" HorizontalAlign="Left" />
                                <RowStyle BackColor="#F7F6F3" ForeColor="#333333" />
                                <SelectedRowStyle BackColor="#E2DED6" Font-Bold="True" ForeColor="#333333" />
                                <SortedAscendingCellStyle BackColor="#E9E7E2" />
                                <SortedAscendingHeaderStyle BackColor="#506C8C" />
                                <SortedDescendingCellStyle BackColor="#FFFDF8" />
                                <SortedDescendingHeaderStyle BackColor="#6F8DAE" />
                            </asp:GridView>
                        </asp:Panel>
                        <asp:CollapsiblePanelExtender ID="cpe1" runat="server" TargetControlID="pBody1" CollapseControlID="pHeader1"
                            ExpandControlID="pHeader1" Collapsed="true" TextLabelID="lblHeaderText1" CollapsedText="Show"
                            ExpandedText="Hide" CollapsedSize="0"
                            ScrollContents="false">
                        </asp:CollapsiblePanelExtender>
                    </ItemTemplate>
                </asp:Repeater>
                </ContentTemplate>
                </UpdatePanel>

我添加了更新面板。从我的研究到目前为止,我知道我们应该使用更新面板来防止页面在自动回发时跳转。但是,我的工作不起作用。任何指南?

提前致谢。

1 个答案:

答案 0 :(得分:1)

您可以使用页面MaintainScrollPositionOnPostback的{​​{1}}属性。见下面的示例:

Directive