Portal Row Reordering using Drag & Drop

Ahh.., don't you just love it when a solution pops into your head and it's super simple and works great as well.

Such was the situation when a new subscriber wrote in asking me about an older technique from 2010. While the basic premise of comparing one container field against another makes sense, it's quite a bit harder to put this into practice within the same portal.

Either the field you're dragging from will obscure the field you need to drop into or FileMaker just doesn't have the feature set in order to make it technically happen. When script triggers won't fire until after the "drop" portion of a "drag and drop" sequence" you need to figure out how to make it happen.

That's exactly what this video is about. It's a super sublime implementation to a simple feature request. Being able to support Drag & Drop within the same portal without a whole lot of hassle.

How about accomplishing it without any extra table occurrences, calculations and only one field and one script? Watch now to find out how!

AttachmentSize
DragDropPortalReordering.zip49.46 KB

Comments

So many examples that you find on the net lack the data separation approach.
Very well explained and with a nice touch on the on exit script.

Cheers
ole

Hi Matt

thank you once again for an amazing resource. Just a quick question to you and I haven't begun to dig into your solution.
When I add items to a portal sub items are added to the portal for that item as well. When dragging the main item, I would love the sub items to move with the main item. Any thoughts on achieving that :)

Hi Matt! would this work on FMP 11?
Thanks!

I think the first thing I'm going to do is parameterize the portal object name and the portal table occurrence name...

Then we'd literally have one script in the entire solution for all portals.

lol, Hal, I was wondering how you managed to modify this so that you can use the script throughout the solution and with multiple portals on a layout (each with drag and drop). I named each drag handle for the portal it's in. Very interested in how you approached this. -Barb

This works great. There are a few things to note from my testing.

1) Since the global container is open, users can drag and drop their own image file into the container.
2) When using the separation model, you cannot have the portal on a modal (dialog) window. You must use a floating document window.

Very well thought out and put together. However, I am unable to understand how you are inserting tab values in the display variable. Can you give me some direction, please?

In the Data Separation model, the script that returns the $$DROP value must also null the $$DROP session/file global. I did this by setting $$DROP to $DROP, setting $$DROP to "", then exiting the Script with the $DROP variable.

ABDEnterprises.com - Business and Database Consulting

In implementing this file into my database, I came across a problem. My existing relationship the regular Equal type, as opposed to the demo files's cartesian type. All works fine until I tick the add vertical scroll bar to the portal, then I end up in an endless loop in the creation of new child records with the order field populated. Any ideas anyone? This solution is the answer to my prayers....once I get it working.

Eric

Sussed it. Uncheck allow creation of records in the relationship edit. However, the drop container Doesn't appear to scroll, which means if you have something at the portal bottom that you want to drag/drop to the top, this is accomplished incrementally.

Eric

I found this to be very helpful. Just implemented it as both a portal and list view version. This worked great in both 12 and 13 versions of Pro. I tried it in WebDirect and the script is triggered, but the browser gives an error message "Please select file to upload" and the script fails to re-order the portal. Someday would you see if you can come up with a WebDirect version?

Hi Matt,

I've come across a number of issues in my databases when implementing them on an iPad. Do you have any pointers to solve issues like drag and drop in Go (aim to allow portal rows to be reorganised for a survey - i.e questions to be put to patients etc). I'm about to start learning some HTML, CSS and JS as it sadly seems like it's becoming a way to solve these issues in FM with a web viewer.

Thanks

Zab

Hi,

I am unable to get this to work. Can anybody help ?

That is a brilliant technique Monsieur Petrowsky ! Thank you.

jyb