How to drag a row of a datagrid on a button and get its ID ?
Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller, robinmiller
How to drag a row of a datagrid on a button and get its ID ?
Hi,
I would like to drag a row of a datagrid and get its ID when dropped
on a button...
It is possible ?
Thanks.
I would like to drag a row of a datagrid and get its ID when dropped
on a button...
It is possible ?
Thanks.
-
- VIP Livecode Opensource Backer
- Posts: 1005
- Joined: Sat Apr 08, 2006 3:06 pm
- Contact:
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:
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/downlo ... ry.rev.zip
dragdroptest Stack
http://www.bluemangolearning.com/downlo ... optest.zip
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
revDataGridLibrary Stack (1.0.0 build 22)
http://www.bluemangolearning.com/downlo ... ry.rev.zip
dragdroptest Stack
http://www.bluemangolearning.com/downlo ... optest.zip
Trevor DeVore
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
Trevor, I am amazed ! Many thanks for this contribution.
Trevor, I am amazed ! Many thanks for this contribution.
Drag a row from a datagrid into another
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.
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.
-
- VIP Livecode Opensource Backer
- Posts: 1005
- Joined: Sat Apr 08, 2006 3:06 pm
- Contact:
To start the drag you would do something like this in the data grid group script:
Then in the data grid that is going to receive the drop you could do this:
Note that the above code is completely untested.
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
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
Trevor DeVore
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
Hi Trevor... that does not work ...
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 !
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

-
- VIP Livecode Opensource Backer
- Posts: 1005
- Joined: Sat Apr 08, 2006 3:06 pm
- Contact:
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:
Data grid 2:
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
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
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
Trevor... I am blown away, thanks a bunch !
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.
Good luck with the conference

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.
-
- VIP Livecode Opensource Backer
- Posts: 1005
- Joined: Sat Apr 08, 2006 3:06 pm
- Contact:
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?
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
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
Thanks again Trevor
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.
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.
The drag & drop from datagrid1 to datagrid 2 does not wo
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 ?
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 ?
-
- VIP Livecode Opensource Backer
- Posts: 1005
- Joined: Sat Apr 08, 2006 3:06 pm
- Contact:
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.
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
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
to update the revDataGridLibrary ?
Hi Trevor,
thanks for your as always "precious help"
how to proceed to update the revDataGridLibrary ?
Many thanks
thanks for your as always "precious help"
how to proceed to update the revDataGridLibrary ?
Many thanks
-
- VIP Livecode Opensource Backer
- Posts: 1005
- Joined: Sat Apr 08, 2006 3:06 pm
- Contact:
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
http://tr.im/data_grid
Trevor DeVore
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder
ScreenSteps - https://www.screensteps.com
LiveCode Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode
LiveCode Builder Repos - https://github.com/search?q=user%3Atrevordevore+topic:livecode-builder