当用户点击datalist项目时，如何停止页面跳转并维护面板和浏览器滚动位置？

Question

I have a datalist inside the panel

<asp:Panel ID="Panel1" runat="server"  ScrollBars="Vertical">
  <asp:DataList ID="DataList1" runat="server" RepeatDirection="Horizontal"  OnItemDataBound="DataList1_ItemDataBound" CaptionAlign="Left">
    <ItemTemplate>
       <asp:ImageButton ID="btn1" runat="server" ImageUrl='<%#"~/Images.ashx?Name=" +DataBinder.Eval(Container.DataItem, "Path") %>'
           OnCommand="Item_Command" CommandArgument='<%# Eval("Id").ToString() +";"+Eval("Path")%>' />
    </ItemTemplate>
  </asp:DataList>
</asp:Panel>

On Item_Command I am adding the style to btn1 such as border and color, and getting the id of selected item

string[] str = e.CommandArgument.ToString().Split(';');
Id = Convert.ToInt32(str[0]);

When I am selecting the item page is jumping, suppose I have scrolled browser scrollbar to bottom and selected an image browser scroll is going on top and again its coming on bottom, On Item_Command I am enabling and disabling few other btn which is out side of datalist, if i am keeping the datalist inside the updatepanel then all other btn is not getting enable or disable thats why i am not using update panel. I have all the controls inside the update panel. I tried with how to retain the browser scroll position after any event gets fire but its not working, i am setting

Page.MaintainScrollPositionOnPostBack = true;
AutoEventWireup="true"

that also not working for me. I am using VS 2010, 4.0 with C#.

Some one plz tell me how to stop page jumping and maintain both panel1 and browser scroll position when user click on datalist item?

thanks in advanced..

Answer 1

Use a clientside function on Client click event of your image button like this

javascript:void(0);

, it works for me in update panel,

<asp:ImageButton OnClientClick="javascript:void(0);" ID="btn1" runat="server" ImageUrl="~/Help2.png" AlternateText="asas"/>

Edit

1. Put the button & datalist inside a updatePanel. Set

UpdateMode=Conditional

for the udpatePanel.

1. When you perform your operation on the dataList row. Just update the update panel manually like this

// Your image button event

YourUpdatePanel.Update();

This coupled with what I posted earlier should fix your problem. Also you might not need MainScrollPositionOnPostBack=true by using above.

Damien.

Answer 2

嗯，这就是想法：使用一个大的更新面板，覆盖整个页面以维护页面滚动或使用多个更新面板来覆盖您想要更新的所有项目！

Answer 3

尝试在Page标记内设置MaintainScrollPositionOnPostback true：

 <%@ Page (...) MaintainScrollPositionOnPostback="true" (...) %>