[CLOSED] Maintain scroll position in Ext.NET

  1. #1

    [CLOSED] Maintain scroll position in Ext.NET

    Please let me know how to maintain scroll position after postback in Gridpanel or Panel.

    is it possible to use MaintainScrollPositionOnPostBack="true" in Top of Page.

    Thank you in advance.
    Last edited by geoffrey.mcgill; Jul 28, 2010 at 9:11 PM.
  2. #2
    Hi,

    Please see the following sample
    <%@ Page Language="C#" %>
    <%@ Import Namespace="System.Collections.Generic" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            this.Store1.DataSource = new List<Company> 
             { 
                 new Company("3m Co", 71.72, 0.02, 0.03),
                 new Company("Alcoa Inc", 29.01, 0.42, 1.47),
                 new Company("Altria Group Inc", 83.81, 0.28, 0.34),
                 new Company("American Express Company", 52.55, 0.01, 0.02),
                 new Company("American International Group, Inc.", 64.13, 0.31, 0.49),
                 new Company("AT&T Inc.", 31.61, -0.48, -1.54),
                 new Company("Boeing Co.", 75.43, 0.53, 0.71),
                 new Company("Caterpillar Inc.", 67.27, 0.92, 1.39),
                 new Company("Citigroup, Inc.", 49.37, 0.02, 0.04),
                 new Company("E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28),
                 new Company("Exxon Mobil Corp", 68.1, -0.43, -0.64),
                 new Company("General Electric Company", 34.14, -0.08, -0.23),
                 new Company("General Motors Corporation", 30.27, 1.09, 3.74),
                 new Company("Hewlett-Packard Co.", 36.53, -0.03, -0.08),
                 new Company("Honeywell Intl Inc", 38.77, 0.05, 0.13),
                 new Company("Intel Corporation", 19.88, 0.31, 1.58),
                 new Company("International Business Machines", 81.41, 0.44, 0.54),
                 new Company("Johnson & Johnson", 64.72, 0.06, 0.09),
                 new Company("JP Morgan & Chase & Co", 45.73, 0.07, 0.15),
                 new Company("McDonald\"s Corporation", 36.76, 0.86, 2.40),
                 new Company("Merck & Co., Inc.", 40.96, 0.41, 1.01),
                 new Company("Microsoft Corporation", 25.84, 0.14, 0.54),
                 new Company("Pfizer Inc", 27.96, 0.4, 1.45),
                 new Company("The Coca-Cola Company", 45.07, 0.26, 0.58),
                 new Company("The Home Depot, Inc.", 34.64, 0.35, 1.02),
                 new Company("The Procter & Gamble Company", 61.91, 0.01, 0.02),
                 new Company("United Technologies Corporation", 63.26, 0.55, 0.88),
                 new Company("Verizon Communications", 35.57, 0.39, 1.11),
                 new Company("Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63)
             };
     
            this.Store1.DataBind();
        }
     
        public class Company
        {
            public Company(string name, double price, double change, double pctChange)
            {
                this.Name = name;
                this.Price = price;
                this.Change = change;
                this.PctChange = pctChange;
            }
     
            public string Name { get; set; }
            public double Price { get; set; }
            public double Change { get; set; }
            public double PctChange { get; set; }
        }
    </script>
     
    <!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 id="Head1" runat="server">
        <title>Ext.NET Example</title>
        
        <script type="text/javascript">
            function restoreScroll(view, field){
                if(!Ext.isEmpty(field.getValue(), false)){
                    var scrollPos = parseInt(field.getValue());
                    view.scroller.dom.scrollTop = scrollPos;        
                }
            }
        </script>
    </head>
    <body>
        <form runat="server">
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        <ext:Hidden ID="ScrollStore" runat="server" />
        <ext:Store ID="Store1" runat="server">
            <Reader>
                <ext:JsonReader>
                    <Fields>
                        <ext:RecordField Name="Name" />
                        <ext:RecordField Name="Price" />
                        <ext:RecordField Name="Change" />
                        <ext:RecordField Name="PctChange" />
                    </Fields>
                </ext:JsonReader>
            </Reader>
        </ext:Store>
        <ext:GridPanel ID="GridPanel1" runat="server" StoreID="Store1" StripeRows="true"
            Title="Company List" Width="600" Height="200" AutoExpandColumn="Company">
            <ColumnModel ID="ColumnModel1" runat="server">
                <Columns>
                    <ext:Column ColumnID="Company" Header="Company" Width="160" DataIndex="Name" />
                    <ext:Column Header="Price" Width="75" DataIndex="Price"/>
                    <ext:Column Header="Change" Width="75" DataIndex="Change"/>
                    <ext:Column Header="Change" Width="75" DataIndex="PctChange"/>
                </Columns>
            </ColumnModel>
            <Listeners>
                <ViewReady Handler="restoreScroll(this.view, #{ScrollStore});" Single="true" />
            </Listeners>
        </ext:GridPanel>
        
        <ext:Button runat="server" Text="Postback" AutoPostBack="true">
            <Listeners>
                <Click Handler="#{ScrollStore}.setValue(#{GridPanel1}.view.scroller.dom.scrollTop);" />
            </Listeners>
        </ext:Button>
        </form>
    </body>
    </html>

Similar Threads

  1. [CLOSED] [1.2] GridPanel and Store reload scroll position?
    By Timothy in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Oct 17, 2011, 5:45 PM
  2. Replies: 1
    Last Post: Oct 06, 2011, 8:12 AM
  3. [CLOSED] Grid - scroll position
    By jwf in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: May 26, 2011, 11:13 PM
  4. How to maintain state of Checkboxgroup
    By Jamishra in forum 1.x Help
    Replies: 0
    Last Post: Nov 19, 2009, 12:01 PM
  5. multi select scroll position
    By [WP]joju in forum 1.x Help
    Replies: 1
    Last Post: Apr 13, 2009, 12:13 PM

Tags for this Thread

Posting Permissions