How to drag a row of a datagrid on a button and get its ID ?

LiveCode is RunRev's premier environment for creating multi-platform solutions for all major operating systems - Windows, Mac OS X, Linux, the Web, Server environments and Mobile platforms. Brand new to LiveCode? Welcome!

Moderators: Klaus, FourthWorld, heatherlaine, robinmiller, kevinmiller

How to drag a row of a datagrid on a button and get its ID ?

Postby titobal » Sun Aug 09, 2009 11:26 am

Hi,

I would like to drag a row of a datagrid and get its ID when dropped
on a button...

It is possible ?

Thanks.
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

Any tip ?

Postby titobal » Thu Aug 20, 2009 9:06 am

Any tip ?
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

Postby trevordevore » Thu Aug 20, 2009 4:59 pm

I recently polished up the undocumented drag drop/reorder routines in the data grid. I've uploaded this test version of the data grid to my server along with a stack that has some sample code.

There are no docs yet but if you look at the group script of either data grid in the test stack you can see how it works. I think for what you are doing the following would work:

Code: Select all
on dragStart
    put the dgIndex of the dgDataControl of the target into theIndex
    set the dgDragImageIndex of me to theIndex   
    set the dragData["private"] to THE_ID
end dragStart


The above code would create an image of the row the user is dragging and would start a drag opeation because the dragData["private"] property is being set. If a drop occurs on a button then the dragData["private"] could have the id you want.

revDataGridLibrary Stack (1.0.0 build 22)

http://www.bluemangolearning.com/download/revolution/tools/revdatagridlibrary.rev.zip

dragdroptest Stack

http://www.bluemangolearning.com/download/revolution/tools/dragdroptest.zip
Trevor DeVore
Blue Mango Learning Systems: Makers of ScreenSteps and Clarify
LiveCode Resources for Developers: http://livecode.bluemangolearning.com
trevordevore
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
 
Posts: 600
Joined: Sat Apr 08, 2006 3:06 pm
Location: McLean, Virginia

Trevor, I am amazed ! Many thanks for this contribution.

Postby titobal » Thu Aug 20, 2009 8:32 pm

Trevor, I am amazed ! Many thanks for this contribution.
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

Drag a row from a datagrid into another

Postby titobal » Fri Aug 21, 2009 2:38 pm

Trevor,

thanks again for your help.

Based on the sample stack I would like to be able to pick from Datagrid1
a row and drag and drop it onto Datagrid2, then at drop time it would
copy the row from datagrid1 into Datagrid2... don't know if I am clear enough...

How would you do that ?

Thanks again for your precious help.
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

Postby trevordevore » Sun Aug 23, 2009 4:08 am

To start the drag you would do something like this in the data grid group script:

Code: Select all
on dragstart
    put the dgIndex of the dgDataControl of the target into theIndex

    ## sets the dragImage
    set the dgDragImageIndex of me to theIndex

    ## Store identifier of what is stored in private dragData
    ## along with index of row being dragged.
    ## Setting dragData["private"] also starts drag operation.
    set the dragData["private"] to "data grid row" & theIndex
end dragstart


Then in the data grid that is going to receive the drop you could do this:

Code: Select all
on dragEnter
    if line 1 of the dragData["private"] is "data grid row" then
        ## Get reference to data grid that drag started from
        put the dgControl of the dragSource into theDataGrid

        ## Get row that was dragged
        put the dgDataOfIndex[ line 2 of the dragData["private"] ] of theDataGrid into theRowDataA

        ## Insert dragged row as last line in this data grid.
        AddData theRowDataA
    end if
end dragEnter


Note that the above code is completely untested.
Trevor DeVore
Blue Mango Learning Systems: Makers of ScreenSteps and Clarify
LiveCode Resources for Developers: http://livecode.bluemangolearning.com
trevordevore
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
 
Posts: 600
Joined: Sat Apr 08, 2006 3:06 pm
Location: McLean, Virginia

Hi Trevor... that does not work ...

Postby titobal » Mon Aug 24, 2009 10:41 am

Hi Trevor... that does not work ...

I know that you are very busy with the Runrev conference approaching.

I've removed the dragreorder on the second grid,
and changed the drag event on grid 1 with the one you gave lastly and it does not work...

Any idea ?

Many thanks Grid Master :-)) Trevor !
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

Postby trevordevore » Mon Aug 24, 2009 2:40 pm

Here is some code that works. I left out a CR when setting the dragData and was processing the drop in dragEnter rather than dragDrop.

Data grid 1:

Code: Select all
on dragStart
    put the dgIndex of the dgDataControl of the target into theIndex
    set the dgDragImageIndex of me to theIndex
   
    set the dragData["private"] to "data grid row" & cr & theIndex
end dragStart


Data grid 2:

Code: Select all
on dragEnter
    put the dragData["private"]
   
    if line 1 of the dragData["private"] is "data grid row" then
        set the dragaction to "copy"
    else
        set the dragaction to "none"
    end if
end dragEnter


on dragDrop
    ## Get reference to data grid that drag started from
    put the dragsource into theControl
    put the dgControl of theControl into theDataGrid
     
    ## Get row that was dragged
    put the dgDataOfIndex[ line 2 of the dragData["private"] ] of theDataGrid into theRowDataA
     
    ## Insert dragged row as last line in this data grid.
    AddData theRowDataA
end dragDrop
Trevor DeVore
Blue Mango Learning Systems: Makers of ScreenSteps and Clarify
LiveCode Resources for Developers: http://livecode.bluemangolearning.com
trevordevore
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
 
Posts: 600
Joined: Sat Apr 08, 2006 3:06 pm
Location: McLean, Virginia

Trevor... I am blown away, thanks a bunch !

Postby titobal » Fri Aug 28, 2009 11:20 pm

Thanks again Trevor for your helping me out in my discovery of the Fabulous datagrids in RunRev.

Good luck with the conference :-) coming soon (bought the simulcast express and hope to see you in action !)

One last thing...

I populate a datagrid with mp3 files (paths+name) in a hidden column,
then I would like to add another column with a play/stop button for each row of the grid.

The goal is to play each mp3 file by clicking the corresponding button
on the row of the mp3 file... (don't know if I'm clear)...using a player (via quicktime)

How would you implement that ?

Any suggestion is very welcomed .

Thanks again.
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

Postby trevordevore » Sat Aug 29, 2009 1:46 am

My suggestion would be to start off with a single player object that plays the song that is clicked on (like iTunes does) rather than trying to have a separate player associated with each row.

If you take the single player approach then it is just a matter of adding a key to each row of data (hidden column if you will) that keeps track of whether or not a row is playing. The key could be "playing" for example. The key would default to a value of false for every row and your FillInData handler would show the play icon.

When the user clicks on the play button you would:

a) Toggle the "playing" value for the row that is currently playing (see (d) )

b) Set the "playing" key for that row to true by setting the dgDataOfIndex. This would refresh the row by calling FillInData which would display the pause icon since "playing" would be true.

c) Extract the the mp3 file name and assign it to the player object.

d) Log the index (or line) of the row in the data grid that is playing. This is what is used in (a) to turn off playing visually.

Make sense?
Trevor DeVore
Blue Mango Learning Systems: Makers of ScreenSteps and Clarify
LiveCode Resources for Developers: http://livecode.bluemangolearning.com
trevordevore
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
 
Posts: 600
Joined: Sat Apr 08, 2006 3:06 pm
Location: McLean, Virginia

Thanks again Trevor

Postby titobal » Sat Aug 29, 2009 8:54 am

Thanks again Trevor.

I think you are right regarding having a player object apart from the grid.

As I need to play only 1 mp3 at a time I think I will go for a Global variable (isplaying for example) for determining if there is something playing or not, each time a row is clicked and the status isplaying is true, I stop the player and assign the clicked row to the player...

Thanks again for your help.
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

The drag & drop from datagrid1 to datagrid 2 does not wo

Postby titobal » Wed Sep 23, 2009 8:59 am

Hi Trevor,

I don't know why but the sample does not work in Build 910 4.0.0 dp4
of runtime revolution enterprise.

Perhaps I need a newer build of the datagrid component ?

The line is dragged and when dropped the inserted line is blank.

By the way how could I implement in the destination grid a divider line
which tells the user the dropped line will be placed under that divider ?
(just like the divider in the reorder grid example)...

Any clue ?
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

Postby trevordevore » Wed Sep 23, 2009 2:55 pm

You have to update the revDataGridLibrary stack again as dp-4 doesn't have the version of the data grid that supports drag reordering.

As for showing the line showing drop target: Just set the dgTrackDragReorder property with an index of 0 in the Data Grid that accepts the drop.

Code: Select all
on dragEnter
   put the dragData["private"]
   
   if line 1 of the dragData["private"] is "data grid row" then
      set the dragaction to "copy"
      set the dgTrackDragReorder [0] of me to true
   else
      set the dragaction to "none"
   end if
end dragEnter
Trevor DeVore
Blue Mango Learning Systems: Makers of ScreenSteps and Clarify
LiveCode Resources for Developers: http://livecode.bluemangolearning.com
trevordevore
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
 
Posts: 600
Joined: Sat Apr 08, 2006 3:06 pm
Location: McLean, Virginia

to update the revDataGridLibrary ?

Postby titobal » Wed Sep 23, 2009 3:38 pm

Hi Trevor,

thanks for your as always "precious help"

how to proceed to update the revDataGridLibrary ?

Many thanks
titobal
 
Posts: 31
Joined: Thu Aug 06, 2009 1:51 pm

Postby trevordevore » Wed Sep 23, 2009 3:44 pm

Same way you did before. Just download the revDataGridLibrary using the url in the 3rd post of this thread. You can also follow the instructions linked to from the RunRevLive conference page:

http://tr.im/data_grid
Trevor DeVore
Blue Mango Learning Systems: Makers of ScreenSteps and Clarify
LiveCode Resources for Developers: http://livecode.bluemangolearning.com
trevordevore
VIP Livecode Opensource Backer
VIP Livecode Opensource Backer
 
Posts: 600
Joined: Sat Apr 08, 2006 3:06 pm
Location: McLean, Virginia

Next

Return to Getting Started with LiveCode - Experienced Developers

Who is online

Users browsing this forum: No registered users and 1 guest