[CLOSED] GridPanel: Drag and Drop

  1. #1

    [CLOSED] GridPanel: Drag and Drop


    I defined a GridPanel with a cellselectionModel. When I make a Drag I get a tooltip with the row and cell index. something like [0,0].

    How can I disabled it? I don't want this tooltip.

    Any idea?

    Last edited by Daniil; Aug 09, 2010 at 6:49 AM.
  2. #2

    You can set DDText property of GridPanel.
    DDText="Your text"
    Or would you like to disable tooltip at all?
  3. #3
    Thank you for your reply.

    I would like to disable tooltip at all. How can I do it?

    One note: I use cellselectionModel for the gridpanel and therefore I use DragZone to enable drag and drop. it works fine. I only want to disable the tooltip.

  4. #4

    Try to add the following code to the DragZone
    <OnDrag Handler="this.proxy.el.hide();"/>
    Vladimir Shcheglov
    Sr. Developer
  5. #5

    Thank you vlad for your solution. It works but I don't have any more the impression I'm making a drag. Is it possible to show only the green circle i.e this green circle without the tooltip for example [0,0].

    I thought I can use Daniil's solution and set an empty text for the config property. But it is not possible with cellselectionModel. How can I do the same with DragZone?

  6. #6

    Please look at this possible solution for your problem.
    The key points:
    1. Overriding getDragData function of Ext.grid.GridDragZone,
    2. Using GetDragDropText section of GridPanel control and returning empty string from its handler.

    <%@ Page Language="C#" %>
    <%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <script runat="server">
        protected void Page_Load(object sender, EventArgs e)
            if (!X.IsAjaxRequest)
                Store store = this.GridPanel1.Store.Primary;
                store.DataSource = new object[] { 
                                             new object[] {"3m Co"},
                                             new object[] {"Alcoa Inc"},
                                             new object[] {"Altria Group Inc"}
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title>Ext.Net Example</title>
        <ext:ResourcePlaceHolder runat="server" />
        <script type="text/javascript">
                getDragData: function(e) {
                    var t = Ext.lib.Event.getTarget(e);
                    var rowIndex = this.view.findRowIndex(t);
                    var cellIndex = this.view.findCellIndex(t);
                    if (rowIndex !== false) {
                        var sm = this.grid.selModel;
                        if (Ext.isDefined(sm.getSelectedCell)) { // sm is CellSelectionModel?
                            if (!sm.getSelectedCell() || !(sm.getSelectedCell()[0] == rowIndex) ||
                                !(sm.getSelectedCell()[1] == cellIndex) ||
                                e.hasModifier() || sm.keepSelectionOnClick == "always") {
                                sm.handleMouseDown(this.grid, rowIndex, cellIndex, e);
                            return { grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, cellIndex: cellIndex };
                        } else {
                            if (!sm.isSelected(rowIndex) || e.hasModifier() || sm.keepSelectionOnClick == "always") {
                                sm.handleMouseDown(this.grid, rowIndex, e);
                            return { grid: this.grid, ddel: this.ddel, rowIndex: rowIndex, selections: sm.getSelections() };
                    return false;
        <form runat="server">
        <ext:ResourceManager runat="server" />
                <ext:Store runat="server">
                                <ext:RecordField Name="company" />
            <ColumnModel runat="server">
                    <ext:Column Header="Company" DataIndex="company" />
                <ext:CellSelectionModel runat="server" />
            <GetDragDropText Handler="return '';"/>
  7. #7

    I tried the proposed solution but it doesn't work.

    I found nonetheless the solution and it was simple.

    There was the following config option within the DragZone

    <OnInitDrag Fn="onInitDrag" />
    The onInitDrag function was defined as follow. I only retrieve the line which set the Drag text.

    function onInitDrag(e) {
    var data = this.dragData; 
    //this.ddel.innerHTML = String.format("[{0},{1}]", data.cellIndex, data.rowIndex); 
    Thank you all for your reply.

  8. #8
    Yes, your solution looks easier than mine :)
    Thanks for the post.

Similar Threads

  1. Drag-drop Gridpanel
    By johny_bravo in forum 1.x Help
    Replies: 0
    Last Post: Mar 25, 2011, 5:37 PM
  2. [CLOSED] Get cell in gridpanel drag and drop
    By jchau in forum 1.x Legacy Premium Help
    Replies: 2
    Last Post: Apr 18, 2010, 5:40 PM
  3. [CLOSED] GridPanel Drag and Drop
    By martin.mosimann in forum 1.x Legacy Premium Help
    Replies: 1
    Last Post: Aug 21, 2009, 6:47 AM
  4. Drag & Drop Between GridPanel and Form
    By SilverSeva in forum 1.x Help
    Replies: 0
    Last Post: Jul 22, 2009, 10:06 AM
  5. GridPanel drag and drop
    By davidhoyt in forum 1.x Help
    Replies: 5
    Last Post: Oct 13, 2008, 3:40 PM

Posting Permissions