Hi all,
Is it possible to maintain the panel1 control scrollbar position?
I have photo gallery developed in ASP.net page, in the html page the panel1 control is configured with horizontal scrollbars, when I select an image from far right side of panel1 the scrollbar position resets back to the left.
I tried the following code SmartNavigation="True" into page directive. But that did not work as expected.
I also tried java script to maintain the scrollbar position but that cause the panel1 not to load the image to panel2.
javascript:
<asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager><script type="text/javascript" >
var xPos, yPos;
var prm = Sys.WebForms.PageRequestManager.getInstance();
prm.add_beginRequest(BeginRequestHandler);
prm.add_endRequest(EndRequestHandler);
function BeginRequestHandler(sender, args) {
xPos = document.getElementById("<%=Panel1.ClientID %>").scrollLeft;
yPos = document.getElementById("<%=Panel1.ClientID %>").scrollTop;
}
function EndRequestHandler(sender, args) {
document.getElementById("<%=Panel1.ClientID %>").scrollLeft = xPos;
document.getElementById("<%=Panel1.ClientID %>").scrollTop = yPos;
}</script>here is my aspx page:
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head runat="server"><title>Photo Gallery</title></head><body><form id="form1" runat="server"><div align="center"><asp:FileUpload ID="FileUpload1" runat="server" /><asp:Button ID="btnUpload" runat="server" onclick="btnUpload_Click"
Text="Upload" /><br /><br /><asp:Panel ID="Panel2" runat="server" Width="800px" Height="500px"
BorderStyle="Solid" BorderColor="Navy"><asp:Image ID="Image1" runat="server" Height="500px" Width="800px" /></asp:Panel><asp:Label ID="LblFileName" runat="server" Font-Bold="True" ForeColor="Navy"></asp:Label><br /><asp:Panel ID="Panel1" runat="server" BorderColor="Navy" BorderStyle="Solid" Height="130px"
ScrollBars="Horizontal" Width="900px" Wrap="False"></asp:Panel></div></form></body></html>Code Page:
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.IO;
public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
UploadFile();
}
protected void btnUpload_Click(object sender, EventArgs e)
{
if (FileUpload1.HasFile)
{
string fileName = FileUpload1.FileName;
FileUpload1.PostedFile.SaveAs(Server.MapPath("~/Images/" + fileName));
}
Response.Redirect("~/Default.aspx");
}
private void UploadFile()
{
foreach (string strFileName in Directory.GetFiles(Server.MapPath("~/Images/")))
{
ImageButton imageButton = new ImageButton();
FileInfo fileInfo = new FileInfo(strFileName);
imageButton.ImageUrl = "~/Images/" + fileInfo.Name;
imageButton.Width = Unit.Pixel(100);
imageButton.Height = Unit.Pixel(100);
imageButton.Style.Add("padding", "5px");
imageButton.Click += new ImageClickEventHandler(imageButton_Click);
Panel1.Controls.Add(imageButton);
}
}
void imageButton_Click(object sender, ImageClickEventArgs e)
{
Image1.ImageUrl = (((ImageButton)sender).ImageUrl);
var image = Path.GetFileName(((ImageButton)sender).ImageUrl.ToString());
LblFileName.Text = image;
}
}I appreciate any help.
Thanks in advance.