What's New?

[CLOSED] Lockable grid auto scrolling problem

Page 1 of 2 12 LastLast
  1. #1
    Nov 25, 2014, 9:12 PM

    [CLOSED] Lockable grid auto scrolling problem

    Hi,

    I have this problem: when I select one of the latest visible rows on a lockable grid (that has no locked column) it scroll the rows towards the top putting the selected row at the middle of the grid. In this way the row under the mouse pointer is no longer the one I selected.
    This is the code to reproduce the problem.

    VIEW

    @using Ext.Net;
@using Ext.Net.MVC;
@model System.Collections.IEnumerable
@{
    Layout = null;
}
<!DOCTYPE html>
<html>
<head>
    <title>Ext.NET MVC Sample</title>
    <link type="text/css" rel="stylesheet" href="http://speed.ext.net/www/intro/css/main.css" />
    <style>
        .x-grid-row-over .x-grid-cell-inner {
            font-weight: bold;
        }
    </style>

    <script>
        var template = '<span style="color:{0};">{1}</span>';

        var change = function (value) {
            return Ext.String.format(template, (value > 0) ? "green" : "red", value);
        };

        var pctChange = function (value) {
            return Ext.String.format(template, (value > 0) ? "green" : "red", value + "%");
        };
    </script> </head>
<body>
    @(Html.X().ResourceManager())
@(
 Html.X().Viewport()
    .ID("mainViewport")
    .Layout(LayoutType.Border)
    .Items(vpitems =>
    {
        vpitems.Add(

            Html.X().Panel()
            .ID("processArea")
            .Region(Region.Center)
            .Layout(LayoutType.Fit)
            .Items(
            i => i.Add(

Html.X().GridPanel()
.EnableLocking(true)
                .Title("Array Grid")
                .Store(Html.X().Store()
                        .Model(Html.X().Model()
                                .Fields(
                                        new ModelField("company"),
                                        new ModelField("price", ModelFieldType.Float),
                                        new ModelField("change", ModelFieldType.Float),
                                        new ModelField("pctChange", ModelFieldType.Float),
                                        new ModelField("lastChange", ModelFieldType.Date, "M/d hh:mmtt")
                                )
                        )
                        .DataSource(Model)
                )
                .ColumnModel(
                        Html.X().Column().Text("Company").DataIndex("company").Flex(1),
                        Html.X().Column().Text("Price").DataIndex("price").Renderer(RendererFormat.UsMoney),
                        Html.X().Column().Text("Change").DataIndex("change").Renderer("change"),
                        Html.X().Column().Text("Change").DataIndex("pctChange").Renderer("pctChange"),
                        Html.X().DateColumn().Text("Last Updated").DataIndex("lastChange")
                )                
        
                )
            )
            );

    })
)


</body>
</html>
    CONTROLLER

    using System.Collections;
using System.Web.Mvc;
using Ext.Net;
using Ext.Net.MVC;
using ExtGridLockScroll.Models;

namespace ExtGridLockScroll.Controllers
{
    public class ExtNetController : Controller
    {
        public ActionResult Index()
        {
            ExtNetModel model = new ExtNetModel()
            {
                Title = "Welcome to Ext.NET",
                TextAreaEmptyText = ">> Enter a Message Here <<"
            };

                        return View(Companies.GetAllCompanies());
        }

        public ActionResult SampleAction(string message)
        {
            X.Msg.Notify(new NotificationConfig
            {
                Icon = Icon.Accept,
                Title = "Working",
                Html = message
            }).Show();

            return this.Direct();
        }
    }

        public class Companies
        {
            public static IEnumerable GetAllCompanies()
            {
                return new object[]
                {
                    new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                    new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                    new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                    new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
                    new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
                    new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
                    new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
                    new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" },
                    new object[] { "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, "9/1 12:00am" },
                    new object[] { "Exxon Mobil Corp", 68.1, -0.43, -0.64, "9/1 12:00am" },
                    new object[] { "General Electric Company", 34.14, -0.08, -0.23, "9/1 12:00am" },
                    new object[] { "General Motors Corporation", 30.27, 1.09, 3.74, "9/1 12:00am" },
                    new object[] { "Hewlett-Packard Co.", 36.53, -0.03, -0.08, "9/1 12:00am" },
                    new object[] { "Honeywell Intl Inc", 38.77, 0.05, 0.13, "9/1 12:00am" },
                    new object[] { "Intel Corporation", 19.88, 0.31, 1.58, "9/1 12:00am" },
                    new object[] { "International Business Machines", 81.41, 0.44, 0.54, "9/1 12:00am" },
                    new object[] { "Johnson & Johnson", 64.72, 0.06, 0.09, "9/1 12:00am" },
                    new object[] { "JP Morgan & Chase & Co", 45.73, 0.07, 0.15, "9/1 12:00am" },
                    new object[] { "McDonald\"s Corporation", 36.76, 0.86, 2.40, "9/1 12:00am" },
                    new object[] { "Merck & Co., Inc.", 40.96, 0.41, 1.01, "9/1 12:00am" },
                    new object[] { "Microsoft Corporation", 25.84, 0.14, 0.54, "9/1 12:00am" },
                    new object[] { "Pfizer Inc", 27.96, 0.4, 1.45, "9/1 12:00am" },
                    new object[] { "The Coca-Cola Company", 45.07, 0.26, 0.58, "9/1 12:00am" },
                    new object[] { "The Home Depot, Inc.", 34.64, 0.35, 1.02, "9/1 12:00am" },
                    new object[] { "The Procter & Gamble Company", 61.91, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "United Technologies Corporation", 63.26, 0.55, 0.88, "9/1 12:00am" },
                    new object[] { "Verizon Communications", 35.57, 0.39, 1.11, "9/1 12:00am" },
                    new object[] { "Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, "9/1 12:00am" },
                    new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                    new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                    new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                    new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
                    new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
                    new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
                    new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
                    new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" },
                    new object[] { "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, "9/1 12:00am" },
                    new object[] { "Exxon Mobil Corp", 68.1, -0.43, -0.64, "9/1 12:00am" },
                    new object[] { "General Electric Company", 34.14, -0.08, -0.23, "9/1 12:00am" },
                    new object[] { "General Motors Corporation", 30.27, 1.09, 3.74, "9/1 12:00am" },
                    new object[] { "Hewlett-Packard Co.", 36.53, -0.03, -0.08, "9/1 12:00am" },
                    new object[] { "Honeywell Intl Inc", 38.77, 0.05, 0.13, "9/1 12:00am" },
                    new object[] { "Intel Corporation", 19.88, 0.31, 1.58, "9/1 12:00am" },
                    new object[] { "International Business Machines", 81.41, 0.44, 0.54, "9/1 12:00am" },
                    new object[] { "Johnson & Johnson", 64.72, 0.06, 0.09, "9/1 12:00am" },
                    new object[] { "JP Morgan & Chase & Co", 45.73, 0.07, 0.15, "9/1 12:00am" },
                    new object[] { "McDonald\"s Corporation", 36.76, 0.86, 2.40, "9/1 12:00am" },
                    new object[] { "Merck & Co., Inc.", 40.96, 0.41, 1.01, "9/1 12:00am" },
                    new object[] { "Microsoft Corporation", 25.84, 0.14, 0.54, "9/1 12:00am" },
                    new object[] { "Pfizer Inc", 27.96, 0.4, 1.45, "9/1 12:00am" },
                    new object[] { "The Coca-Cola Company", 45.07, 0.26, 0.58, "9/1 12:00am" },
                    new object[] { "The Home Depot, Inc.", 34.64, 0.35, 1.02, "9/1 12:00am" },
                    new object[] { "The Procter & Gamble Company", 61.91, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "United Technologies Corporation", 63.26, 0.55, 0.88, "9/1 12:00am" },
                    new object[] { "Verizon Communications", 35.57, 0.39, 1.11, "9/1 12:00am" },
                    new object[] { "Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, "9/1 12:00am" },
                    new object[] { "3m Co", 71.72, 0.02, 0.03, "9/1 12:00am" },
                    new object[] { "Alcoa Inc", 29.01, 0.42, 1.47, "9/1 12:00am" },
                    new object[] { "Altria Group Inc", 83.81, 0.28, 0.34, "9/1 12:00am" },
                    new object[] { "American Express Company", 52.55, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "American International Group, Inc.", 64.13, 0.31, 0.49, "9/1 12:00am" },
                    new object[] { "AT&T Inc.", 31.61, -0.48, -1.54, "9/1 12:00am" },
                    new object[] { "Boeing Co.", 75.43, 0.53, 0.71, "9/1 12:00am" },
                    new object[] { "Caterpillar Inc.", 67.27, 0.92, 1.39, "9/1 12:00am" },
                    new object[] { "Citigroup, Inc.", 49.37, 0.02, 0.04, "9/1 12:00am" },
                    new object[] { "E.I. du Pont de Nemours and Company", 40.48, 0.51, 1.28, "9/1 12:00am" },
                    new object[] { "Exxon Mobil Corp", 68.1, -0.43, -0.64, "9/1 12:00am" },
                    new object[] { "General Electric Company", 34.14, -0.08, -0.23, "9/1 12:00am" },
                    new object[] { "General Motors Corporation", 30.27, 1.09, 3.74, "9/1 12:00am" },
                    new object[] { "Hewlett-Packard Co.", 36.53, -0.03, -0.08, "9/1 12:00am" },
                    new object[] { "Honeywell Intl Inc", 38.77, 0.05, 0.13, "9/1 12:00am" },
                    new object[] { "Intel Corporation", 19.88, 0.31, 1.58, "9/1 12:00am" },
                    new object[] { "International Business Machines", 81.41, 0.44, 0.54, "9/1 12:00am" },
                    new object[] { "Johnson & Johnson", 64.72, 0.06, 0.09, "9/1 12:00am" },
                    new object[] { "JP Morgan & Chase & Co", 45.73, 0.07, 0.15, "9/1 12:00am" },
                    new object[] { "McDonald\"s Corporation", 36.76, 0.86, 2.40, "9/1 12:00am" },
                    new object[] { "Merck & Co., Inc.", 40.96, 0.41, 1.01, "9/1 12:00am" },
                    new object[] { "Microsoft Corporation", 25.84, 0.14, 0.54, "9/1 12:00am" },
                    new object[] { "Pfizer Inc", 27.96, 0.4, 1.45, "9/1 12:00am" },
                    new object[] { "The Coca-Cola Company", 45.07, 0.26, 0.58, "9/1 12:00am" },
                    new object[] { "The Home Depot, Inc.", 34.64, 0.35, 1.02, "9/1 12:00am" },
                    new object[] { "The Procter & Gamble Company", 61.91, 0.01, 0.02, "9/1 12:00am" },
                    new object[] { "United Technologies Corporation", 63.26, 0.55, 0.88, "9/1 12:00am" },
                    new object[] { "Verizon Communications", 35.57, 0.39, 1.11, "9/1 12:00am" },
                    new object[] { "Wal-Mart Stores, Inc.", 45.45, 0.73, 1.63, "9/1 12:00am" }
                };
            }
        }
}
    Last edited by Daniil; Dec 31, 2014 at 2:59 PM. Reason: [CLOSED]
  2. #2
    Nov 26, 2014, 8:12 PM
    Hi Daniil,

    I share the project I used to reproduce the problem.
    You can find it here:

    https://onedrive.live.com/redir?resi...int=file%2czip

    Moreover I attached two images of the chrome window before and immediately after the mouse click.

    Let me know if I could do anything more to help you reproduce the problem.

    Best regards,
    Alberto
    Attached Thumbnails Click image for larger version.  Name: Screen1.png  Views: 13  Size: 70.6 KB  ID: 16651   Click image for larger version.  Name: Screen2.png  Views: 12  Size: 71.1 KB  ID: 16652  
  3. #3
    Nov 27, 2014, 1:57 PM
    Thank you for sharing a test project, but sorry, we don't deal with projects unless we explicitly requests. Please read 7. C) here.
    Forum Guidelines For Posting New Topics
    If requested by a member of the Ext.NET support team, create a simplified Visual Studio (or Visual Web Developer) Project which demonstrates how to reproduce the problem.
    I wrote this:
    Tested with the latest v2 in IE10, Firefox and Chrome. What are your testing conditions?
    Could you, please, answer the question? What is the Ext.NET version and the browser(s) you are testing with?
  4. #4
    Nov 27, 2014, 2:06 PM
    Hi Daniil,

    I used the nuget package Ext.NET.MVC4 version 2.5.3.1 with Chrome version 39.0.2171.71 m.
    To create the test project I just copied your "GridPanel -> ArrayGrid -> Simple" sample and increase the number of rows used by the grid and setting the EnableLocking property to true (".EnableLocking(true)").

    Best regards,
    Alberto.
  5. #5
    Nov 28, 2014, 2:14 PM
    I still cannot reproduce.

    I tested with Ext.NET v2.5.3.1 in the exact same version of Chrome. When I select the last row the scrollbar stays at the same position, it doesn't move at all.

    Could you deploy a test case on the Internet and provide us with a link? Do you have such a possibility?
  6. #6
    Nov 28, 2014, 2:43 PM
    Hi Daniil,

    I just published the test project here :

    http://demo.basisgroup.com/extgridlock/extnet

    Best regards,
    Alberto
  7. #7
    Nov 28, 2014, 2:49 PM
    Hi Daniil,

    I noticed just now that if I lock a column and then unlock it the scroll bug does not occur.
    So you should open the page and just click on the last visible row.

    Best regards,
    Alberto
  8. #8
    Nov 30, 2014, 9:47 PM
    The online test case doesn't reproduce the issue for me.

    I noticed just now that if I lock a column and then unlock it the scroll bug does not occur.
    So you should open the page and just click on the last visible row.
    Yes, after loading the page I do nothing except scrolling to the bottom and clicking the last row.

    Please clarify is it reproducible in Chrome only?

    Is it not reproducible in Firefox or IE?

    Also could you, please, provide a screencast of the issue? Maybe, it would clarify something.
  9. #9
    Dec 01, 2014, 4:38 AM
    Hi Daniil,

    You should not scroll manually to the bottom.
    You should just open the page and click on one of the latest VISIBLE rows and the grid will automatically scroll the rows putting the selected one in the middle of the grid.

    Seems to be e Chrome related problem only.

    Best regards,
    Alberto
  10. #10
    Dec 01, 2014, 3:40 PM
    Sorry, I didn't get it before. Now I am able to reproduce. Yes, it appears to happen in Chrome only. I will try to find a reason of such the behavior.
Page 1 of 2 12 LastLast

Similar Threads

  1. Add new column via javascript to lockable gridPanel
    By retto in forum 2.x Help
    Replies: 10
    Last Post: Oct 16, 2013, 6:57 AM
  2. [CLOSED] Infinite srolling buffered grid scrolling problem
    By ASAPCH in forum 2.x Legacy Premium Help
    Replies: 6
    Last Post: Feb 04, 2013, 3:55 AM
  3. [CLOSED] Buffer scrolling gridpanel does not Work for Lockable feature is enabled.
    By RCM in forum 2.x Legacy Premium Help
    Replies: 6
    Last Post: Oct 23, 2012, 7:12 PM
  4. [CLOSED] TreeGrid : Need the Tree-Grid Column Header to be fixed while scrolling down the grid contents
    By Aparna_B in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Sep 03, 2012, 1:38 PM
  5. Problem with ComboBox scrolling
    By venu.sn2009 in forum 1.x Help
    Replies: 1
    Last Post: Aug 05, 2011, 10:48 AM

Tags for this Thread

Posting Permissions