[OPEN] [#444] Grid Drag and Drop - Moving to position 0 is not possible with groupfield

  1. #1

    [OPEN] [#444] Grid Drag and Drop - Moving to position 0 is not possible with groupfield

    Hi,

    please see the following example.
    I am not able to move a row to the first position (to the top) when I have declared a groupfield. If I remove the Groupfield, everything works fine.
    Is there any fix available?

    <%@ Page Language="VB" %>
     
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
     
     <script runat="server">
    
         Protected Sub Page_Load(sender As Object, e As EventArgs)
             Dim data As New Generic.List(Of Object)()
    
             For i As Integer = 0 To 9
                 data.Add(New With { _
                     .Name = "Record #" + i.ToString(), _
                     .GroupName = "Group 1" _
                 })
             Next
    
             Me.Store1.DataSource = data
             Me.Store1.DataBind()
         End Sub
    </script>
    
    <!DOCTYPE html>
    
    <html>
    <head id="Head1" runat="server">
        <title>Drag and Drop rows to reorganize - Ext.NET Examples</title>
        <link href="/resources/css/examples.css" rel="stylesheet" />
    </head>
    <body>
        <form id="Form1" runat="server">
            <ext:ResourceManager ID="ResourceManager1" runat="server" />
            
            <h1>Drag and Drop rows to reorganize</h1>
            
            <ext:GridPanel ID="GridPanel1"
                runat="server" 
                MultiSelect="true"            
                Title="Grid"
                Width="400"
                Height="300">
                <Store>
                    <ext:Store ID="Store1" runat="server" GroupField="GroupName">
                        <Model>
                            <ext:Model ID="Model1" runat="server">
                                <Fields>
                                    <ext:ModelField Name="Name" />
                                    <ext:ModelField Name="GroupName" />
                                </Fields>
                            </ext:Model>
                        </Model>
                    </ext:Store>
                </Store>
                <ColumnModel>
                    <Columns>
                        <ext:Column ID="Column1" runat="server" Text="Record Name" Width="160" DataIndex="Name" Flex="1" />
                    </Columns>
                </ColumnModel>                    
                <View>
                    <ext:GridView ID="GridView1" runat="server">
                        <Plugins>
                            <ext:GridDragDrop ID="GridDragDrop1" runat="server" DragText="Drag and drop to reorganize"/>
                        </Plugins>
                    </ext:GridView>
                </View>   
                <Features>
                    <ext:Grouping ID="Grouping1" runat="server" />
                </Features>
            </ext:GridPanel>
        </form>    
    </body>
    </html>
    Last edited by Daniil; Feb 28, 2014 at 4:14 AM. Reason: [OPEN] [#444]
  2. #2
    Hi @blueworld,

    Well, it is possible. Please try to drag the row over the group's header and drop. Though, I agree it is not something that a user expects. I will try to find a solution.
  3. #3
    Hi Daniil,

    thank you for having a look at it. Yes it does work on that way, but like you said, the user would not expect it like that.
  4. #4
    Please try:

    Fix
    Ext.view.DropZone.override({
        getPosition: function(e, node) {
            var y      = e.getXY()[1],
                regionEl = Ext.fly(node),
                region,
                pos;
    
            if (regionEl.hasCls("x-grid-wrap-row")) {
                regionEl = regionEl.down("tr.x-grid-data-row");
            }
    
            region = regionEl.getRegion();
    
            if ((region.bottom - y) >= (region.bottom - region.top) / 2) {
                pos = "before";
            } else {
                pos = "after";
            }
    
            return pos;
        },
    
        positionIndicator: function(node, data, e) {
            var me = this,
                view = me.view,
                pos = me.getPosition(e, node),
                overRecord = view.getRecord(node),
                draggingRecords = data.records,
                indicatorY;
    
            if (!Ext.Array.contains(draggingRecords, overRecord) && (
                pos == 'before' && !me.containsRecordAtOffset(draggingRecords, overRecord, -1) ||
                pos == 'after' && !me.containsRecordAtOffset(draggingRecords, overRecord, 1)
            )) {
                me.valid = true;
    
                if (me.overRecord != overRecord || me.currentPosition != pos) {
    
                    nodeEl = Ext.fly(node);
    
                    if (nodeEl.hasCls("x-grid-wrap-row")) {
                        nodeEl = nodeEl.down("tr.x-grid-data-row");
                    }
    
                    indicatorY = nodeEl.getY() - view.el.getY() - 1;
                    if (pos == 'after') {
                        indicatorY += Ext.fly(nodeEl).getHeight();
                    }
    
                            
                    me.getIndicator().setWidth(Ext.fly(view.el).getWidth()).showAt(0, indicatorY);
    
                    // Cache the overRecord and the 'before' or 'after' indicator.
                    me.overRecord = overRecord;
                    me.currentPosition = pos;
                }
            } else {
                me.invalidateDrop();
            }
        }
    });
  5. #5
    Thank you its working fine with this fix
  6. #6
    Thanks. Please keep watch over the fix for a few days. I will do as well. If no new problem arises, I will probably commit it to the trunk.
  7. #7
    Created an Issue to review after the next ExtJS release.
    https://github.com/extnet/Ext.NET/issues/444

    The fix has been committed to the trunk in the revision #5692. It will go to the v2.5 release.

Similar Threads

  1. Replies: 4
    Last Post: Jul 19, 2013, 1:16 AM
  2. [CLOSED] Grid Drag and Drop example
    By vali1993 in forum 1.x Legacy Premium Help
    Replies: 4
    Last Post: Jun 14, 2011, 1:20 PM
  3. [CLOSED] Grid to Grid Drag and Drop Questions
    By dmoore in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Feb 15, 2011, 10:43 AM
  4. Replies: 2
    Last Post: Mar 11, 2009, 8:59 AM
  5. Grid to grid Drag and Drop grouping issue
    By bobs in forum 1.x Help
    Replies: 0
    Last Post: Feb 10, 2009, 7:13 AM

Posting Permissions