[FIXED] [#820] Grid column header interaction (e.g. resize) sometimes triggers unexpected click event

  1. #1

    [FIXED] [#820] Grid column header interaction (e.g. resize) sometimes triggers unexpected click event

    Hello,

    This is the same problem as described in more detail on this forum post which is about Ext.NET 3.x
    http://forums.ext.net/showthread.php?59679

    To reproduce this issue in 1.x, it is a bit simpler:

    <%@ Page Language="C#" %>
    
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!X.IsAjaxRequest)
            {
                Store1.DataSource = Data;
                Store1.DataBind();
            }
        }
    
        private object[] Data
        {
            get
            {
                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" }
                };
            }
        }
    </script>
    
    <!DOCTYPE html>
    
    <html>
    <head runat="server">
        <title>Simple Array Grid - Ext.NET Examples</title>
    </head>
    <body>
        <ext:ResourceManager runat="server" />
        
        <ext:Viewport runat="server" Layout="Fit">
            <Items>
                <ext:GridPanel ID="GridPanel1" runat="server">
                    <Store>
                        <ext:Store ID="Store1" runat="server">
                            <Reader>
                                <ext:ArrayReader>
                                    <Fields>
                                        <ext:RecordField Name="company" />
                                        <ext:RecordField Name="price" Type="Float" />
                                    </Fields>
                                </ext:ArrayReader>
                            </Reader>
                            <CustomConfig>
                                <ext:ConfigItem Name="sort" Value="function() {Ext.MessageBox.show({ msg: 'Cannot sort' }); console.trace(); return false;}" Mode="Raw"/>
                            </CustomConfig>
                        </ext:Store>
                    </Store>
                    <ColumnModel>
                        <Columns>
                            <ext:Column Header="Company" DataIndex="company" Width="100" Fixed="true" />
                            <ext:Column Header="Price" DataIndex="price" />
                        </Columns>  
                    </ColumnModel>
                    <SelectionModel>
                        <ext:RowSelectionModel runat="server" />
                    </SelectionModel>
                </ext:GridPanel>
            </Items>
        </ext:Viewport>
    </body>
    </html>
    To reproduce the problem:
    • Attempt to resize the fixed column (first column) to make it wider
    • Be careful how you move your mouse pointer - as you attempt to resize, your mouse should hover over the some part of the second column's header
    • When you let go of the mouse pointer, you should get a message box showing up saying "Cannot sort"
    • In other words, a header click is triggered when it should not be



    Please note for Ext.NET 1.x, the problem seems to be with IE only (I was testing with IE11). Firefox and Chrome are okay

    Hope that helps.
    Last edited by Daniil; Jul 01, 2015 at 10:15 AM. Reason: [FIXED] [#820]
  2. #2
    Hello Anup,

    Thank you for the report! We'll investigate.
  3. #3
    The issue is easily reproducible to me in Chrome and Firefox as well. I am quite curious why it is not reproducible to you.

    Anyways, I think the bug is the fact that a Column's resizer is shown when it should not be not shown. So, in your test case the left resizer of the second Column should not be shown.

    Logged in GitHub.
    https://github.com/extnet/Ext.NET/issues/820

    I think I have found a related bug in ExtJS 3.4.1 and got it fixed in the revision #6446 (branches/1).

    Moving the thread to the Bugs and closing.

    Though, still looking for your feedback.
  4. #4
    Many thanks for looking into this. I will try to look at this at my earliest (though I may be reassigned to something else for a few weeks again, unfortunately), so will try to update you when I can...!
  5. #5
    Hi,

    This certainly seems to have fixed the issue.

    One my team members finds that he gets this problem intermittently on non fixed columns (even with this update) but I cannot reproduce it...! I will create a new thread with another example if I can ever reproduce it, but you can close this one I suppose!

    Thanks!

Similar Threads

  1. Replies: 4
    Last Post: Jul 01, 2015, 4:03 PM
  2. [CLOSED] How to get column header name on grid panel cell's right click
    By arjunrvasisht in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: May 21, 2015, 4:58 AM
  3. [CLOSED] How to resize Panel after click event ?
    By Daly_AF in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Jan 29, 2013, 11:15 AM
  4. resize column header from right to left
    By CarlosS in forum 1.x Help
    Replies: 0
    Last Post: Mar 31, 2012, 1:05 AM
  5. [CLOSED] Hide the column option(on click of column header) for treegrid
    By AnulekhaK in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Feb 01, 2012, 11:16 AM

Posting Permissions