[CLOSED] [#196] slightly difference between clicking the Row and clicking Row's Checker

  1. #1

    [CLOSED] [#196] slightly difference between clicking the Row and clicking Row's Checker

    Hi folks, i found an slightly difference between clicking the row and clicking row's checker

    First Scenario
    When Record 2 is selected by clicking on the row:


    When Record 6 is selected by clicking on the row:


    Second Scenario - SELECTION MUST BE CLEARED
    When Record 2 is selected by clicking on row's checker:


    When Record 6 is selected by clicking on row's checker:


    Note that on the second scenario, both Record 2 and Record 6 are selected, when only Record 6 was supposed to be selected, since the CRTL Key was not pressed during selection.

    The problem was caused because the SelectionModel's OnRowMouseDown method sets the SelectionMode to Simple if the SelectionMode is not set to Single and if the source of the event was the Row's Checker, as shown below - Lines 12 to 15:

    Note: the method was minified
    onRowMouseDown  = function (b, a, h, d, i) {
        b.el.focus();
        var g = this,
            c = i.getTarget("." + Ext.baseCSSPrefix + "grid-row-checker"),
            j;
        if (!g.allowRightMouseSelection(i)) {
            return
        }
        if (g.checkOnly && !c) {
            return
        }
        if (c) {
            j = g.getSelectionMode();
            if (j !== "SINGLE") {
                g.setSelectionMode("SIMPLE")
            }
        }
    }
    it's possible to see the difference when the SelectionMode is set to Simple, instead of Multi
    selectWithEvent: function (record, e, keepExisting) {
        var me = this;
    
        switch (me.selectionMode) {
            case 'MULTI':
                if (e.ctrlKey && me.isSelected(record)) {
                    me.doDeselect(record, false);
                } else if (e.shiftKey && me.lastFocused) {
                    me.selectRange(me.lastFocused, record, e.ctrlKey);
                } else if (e.ctrlKey) {
                    me.doSelect(record, true, false);
                } else if (me.isSelected(record) && !e.shiftKey && !e.ctrlKey && me.selected.getCount() > 1) {
                    me.doSelect(record, keepExisting, false);
                } else {
                    me.doSelect(record, false);
                }
                break;
            case 'SIMPLE':
                if (me.isSelected(record)) {
                    me.doDeselect(record);
                } else {
                    me.doSelect(record, true);
                }
                break;
            case 'SINGLE':
                // if allowDeselect is on and this record isSelected, deselect it
                if (me.allowDeselect && me.isSelected(record)) {
                    me.doDeselect(record);
                    // select the record and do NOT maintain existing selections
                } else {
                    me.doSelect(record, false);
                }
                break;
        }
    }
    In my scenario it's not expected that SelectionMode is set to Simple, then it's possible to overcome this issue by overriding Ext.selection.Model.selectWithEvent, as shown below:
    
    Ext.selection.Model.override({
        selectWithEvent: function (record, e, keepExisting) {
            var me = this;
    
            switch (me.selectionMode) {
                case 'MULTI':
                case 'SIMPLE':
                    if (e.ctrlKey && me.isSelected(record)) {
                        me.doDeselect(record, false);
                    } else if (e.shiftKey && me.lastFocused) {
                        me.selectRange(me.lastFocused, record, e.ctrlKey);
                    } else if (e.ctrlKey) {
                        me.doSelect(record, true, false);
                    } else if (me.isSelected(record) && !e.shiftKey && !e.ctrlKey && me.selected.getCount() > 1) {
                        me.doSelect(record, keepExisting, false);
                    } else {
                        me.doSelect(record, false);
                    }
                    break;
                case 'SINGLE':
                    // if allowDeselect is on and this record isSelected, deselect it
                    if (me.allowDeselect && me.isSelected(record)) {
                        me.doDeselect(record);
                        // select the record and do NOT maintain existing selections
                    } else {
                        me.doSelect(record, false);
                    }
                    break;
            }
        }
    });
    I would like to know about what you think about this issue, whether it's a bug, etc.

    Thanks in advance

    To check it out, it's possible to use the following example:
    https://examples2.ext.net/#/GridPane...box_Selection/

    or run the following code:

    1 - View
    <!DOCTYPE html>
    <html>
    <head runat="server">
    </head>
    <body>
        <ext:ResourceManager ID="ResourceManager1" runat="server" />
        <ext:GridPanel ID="GridPanel1" Title="Records" runat="server">
            <Store>
                <ext:Store runat="server">
                    <Proxy>
                        <ext:AjaxProxy Url="/Example/LoadFakeRecords/">
                            <ActionMethods Read="POST" />
                            <Reader>
                                <ext:JsonReader Root="data" />
                            </Reader>
                        </ext:AjaxProxy>
                    </Proxy>
                    <Model>
                        <ext:Model runat="server">
                            <Fields>
                                <ext:ModelField Name="ID" Type="String" />
                                <ext:ModelField Name="Name" Type="String" />
                            </Fields>
                        </ext:Model>
                    </Model>
                </ext:Store>
            </Store>
            <ColumnModel runat="server">
                <Columns>
                    <ext:Column Text="ID" DataIndex="ID" runat="server" />
                    <ext:Column Text="Name" Width="500" DataIndex="Name" runat="server" />
                </Columns>
            </ColumnModel>
            <SelectionModel>
                <ext:CheckboxSelectionModel Mode="Multi" runat="server" />
            </SelectionModel>
        </ext:GridPanel>
    </body>
    </html>
    2 - Utility
    public class ExampleController : System.Web.Mvc.Controller
    {
        public ActionResult Index()
        {
            return View();
        }
    
        public StoreResult LoadFakeRecords()
        {
            List<Entity> lst = new List<Entity>();
    
            for (int index = 0; index < 15; index++)
            {
                lst.Add(new Entity
                {
                    ID = index,
                    Name = Guid.NewGuid().ToString()
                });
            }
    
            return new StoreResult(lst, lst.Count());
        }
    }
    3 - Controller
    public class Entity
    {
        public int ID { get; set; }
    
        public string Name { get; set; }
    }
    Attached Thumbnails Click image for larger version. 

Name:	imgth001.png 
Views:	23 
Size:	83.0 KB 
ID:	5979   Click image for larger version. 

Name:	imgth002.png 
Views:	19 
Size:	90.4 KB 
ID:	5980   Click image for larger version. 

Name:	imgth004.png 
Views:	18 
Size:	89.7 KB 
ID:	5981  
    Last edited by Daniil; Dec 19, 2014 at 7:51 PM. Reason: [CLOSED]
  2. #2
    Hello!

    Thank you for good explanations.

    It seems that Sencha wanted CheckboxSelectionModel to have exactly this behavior. However, we will investigate it more.
  3. #3
    Thank you Baidaly. Please keep me posted
  4. #4
    Hello everyone,

    Well, it looks like Sencha has done it intend.

    I think it should be, at least, configurable.
    http://www.sencha.com/forum/showthread.php?260796

    I would say if a developer explicitly sets up mode to "Multi", it should be forced for the checker column as well.
  5. #5
    Sencha opened a bug, we created an Issue to monitor.
    https://github.com/extnet/Ext.NET/issues/196
  6. #6
    I would say if a developer explicitly sets up mode to "Multi", it should be forced for the checker column as well.
    I aggree with you Daniil.


    Thank you all
  7. #7
    It has been fixed on version 3.x.

    Please mark this thread as closed.
  8. #8
    Thank you for the information! Closing.
  9. #9
    Thank you Daniil

Similar Threads

  1. Replies: 3
    Last Post: Oct 13, 2013, 7:06 AM
  2. [CLOSED] Double clicking on row in TreeGrid
    By logicspeak in forum 1.x Legacy Premium Help
    Replies: 6
    Last Post: Oct 02, 2011, 8:43 PM
  3. Menu not hiding when clicking off
    By dbassett74 in forum Bugs
    Replies: 3
    Last Post: May 08, 2009, 4:23 PM
  4. [CLOSED] error when clicking a CheckMenuItem
    By alexp in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: May 01, 2009, 11:10 AM
  5. Open Tab by Clicking Row in Grdpanel
    By alanp5 in forum 1.x Help
    Replies: 0
    Last Post: Mar 25, 2009, 6:23 PM

Posting Permissions