Implementing drag-n-drop between two different portals

I want to provide a simple way for users to link two different sets of data.

I have two portals on a layout, displaying the two lists. I want the user to be able to pick-up an icon from one portal and drop it into a container field on the other portal.

I'm implementing this by using a container field that contains the icon to pickup. When the user picks the icon a script is triggered that puts all of the data needed into a variable.

When the user drops the icon into the container field on the other portal I want to push the variable data into that record.

The problem that I have is the active field and active portal row is the field that the user took the icon from, not the field that they just dropped the icon onto.

In preliminary testing I know that the field is triggering the onObjectModify script trigger call. What I need is a way to determine which portal row the icon was dropped onto.

Any ideas?

Here you can find the solution: https://community.claris.com/en/s/question/0D53w00005OlpndCAB/drag-into-portal-activate-portal-row

I tried it and it works! I like your idea – and the solution of Alex Zueiv for this is pretty cool!

Here’s my test file:
DragBetweenPortals.fmp12 (9,3 MB)
In the source portal set an OnObjectEnter trigger that gets the data to transfer and then goes to object "portal2".
In the target portal let the container create a global variable with the record number via auto calculation while letting the content "self". An OnObjectModify trigger puts the data to the target fields.

UPDATE: I have reworked the file.
Now you can drag the contents of a container in the source portal to a record in one of several target portals to transfer data from one record to another.

DragBetweenPortals_v3.fmp12.zip (8,1 MB)

HOW TO:

  • The source container gets an OnObjectEnter script trigger - see script "Trigger OnObjectEnter Source Container › get details".

  • The target containers get an auto-enter calculation: see containers in tables Target1 and Target2.

  • The target portals should get names: e.g. "Portal.Target1". The respective name is written into a variable in the auto-enter calculation of the target container.

  • In the layout the target containers get an OnObjectModify script trigger - see script: "Trigger OnObjectModify Target Container › write to target".

Hope that helps.

4 Likes

Very nice @mipiano ! Thank you for putting the sample file together and sharing it.

1 Like

That's the missing piece of the puzzle for me. The modified field is able to establish context and pass that information out into variables.

Thanks for putting it altogether @mipiano

1 Like

@Malcolm
Important is: Before the modified field works, the source portal must be exited. For this I jump at the end of the ObObjectEnter script to a layout object outside the portals. Only then the target field can establish the context.

1 Like

Have you considered doing this in Javascript? The sortable jquery ui might be just what you're looking for:

I use sortable to allow sorting of line items in orders/invoices etc and it works really well.

1 Like

Sortable looks like a great UI.

It's not the right fit for this situation as I don't want to rearrange the lists. I have two lists and I want to create relationships between them.

The drag-n-drop gets the user to enter a field to pick up an object. That allows us to obtain data from the source. On drop we obtain data from the target. Then we can create a record in a join table using the information we gathered.