Is there any drag & drop example for Xojo Web?

All I can find seems to be for the old API. Is there any trick with that? There is that seven year old video showing the pony trick - https://www.youtube.com/watch?v=rPkK7RiF1Pg but the events shown are missing now.

I need this functionality for sorting a criteria list in my app by drag and drop. Any idea?

Thanks to all

make your own websdk control, using javascript you can do all the drag and drop you want …

@Michael_Dettmer,

My understanding is that drop and drag was lost in the migration from Web 1 to Web 2.

@Jean-Yves_Pochez is correct in that you can build your own.

However, if you have GraffitiSuite Web, GraffitiDrag is available. The online demo for “Drag” seems close to your use case.

Kind regards, Andrew

Thank you Andrew, I saw the “Drag” sample from GraffitiSuite. Problem is that it does not distinguish WHERE the “drop” happens. Funny if you say "lost in migration. Lost like eggs I carry around? How long is that transition running now and what will be the result? Events are always part of development - but not “drag+drop”?

@Jean-Yves_Pochez - yes, I always can switch to another language. But IF I would do that I would STAY THERE and not use Xojo any more?

It was a disaster to do that same application in Windows - because of the known graphic system problem and flickering - also because of an update. Mac is running fine, anyhow.

Things work fine for Apple only. Anything else causes trouble. I am on the edge to regret having used Xojo now. Not sure if I will use Xojo Web now for the next step of my project. Confusion and desperation on my side again.

There was no migration.

AFAIK, you have to rewrite your web1 applications to get web 2 applications.

Talking about migration let the reader think he lost something and want to know what. The reader lost nothing.

These are two different beasts “incompatibles”… together.

it’s not another language… it is a small brick of xojo code in which you encapsulate some lines of javascript. then the brick becomes available in xojo and you go on with xojo programming.
seeing all the possibilities today you can get with all free javascript libraries, and the rather sparce xojo web components list, IMHO if you want to be serious with xojo web (2) design you NEED to know how to build and use xojo websdk.
if you don’t want, you have to rely only on xojo web controls. or third dev suites like graffiti.

1 Like

You are correct. Learning CSS, javascript and the webSDK is definitely a big plus if you are serious about Xojo Web.

That said, relying on GraffitiSuite is not an issue. Classes are not encrypted. You may adapt the components to your needs. Or, do as I did and ask @Anthony_G_Cyphers to add functionality, or even create a brand new control. I was astonished that twice when I asked for additional functionality, I had the new functionality delivered in my inbox within the day. This is above and beyond good service!

6 Likes

@Emile_Schwarz,

My intent was to answer Michael’s question which I did.

I think he clearly understood from my words that the drop-n-drag functionality present in Web 1 is not available “out-of-the-box” in Web 2. Case closed.

Michael now has several viable solutions should he choose to use them.

I’ve ported several Web 1 apps to Web 2. It can be trivial or non trivial depending on functionality of the app.

So you and Michael both decided to zero in on my use of the word “migration”, a polite term to describe the platform evolution between Web 1 and Web 2 to fuel your agendas. Migration is the correct term as one platform replaced another and the former became end-of-life.

I’m happy for you to whinge and whine to the world, just don’t do it quoting my posts.

Anyway, “go girls”, it’s great to hear you are still crying like it’s August 27, 2020.

For perspective, there have been 30 releases on the Web 2.0 platform since then.

Kind regards, Andrew

a parallel solution, use an input field at first column for the row position and a context menu for first or last position. if you have multiselect you can add buttons to move the entries up or down.
if this work you can look for javascript drag and drop.

i believe this WebListBox is based on datatables:
https://datatables.net/extensions/rowreorder/
https://datatables.net/extensions/rowreorder/examples/initialisation/simple.html

Thanks Markus, the idea to use up/down icons is valid and I tried already. But works only in one table - and I like to use “bubbles” and can also move items between them.

Datatables.net looks nice - do you have an example app with that (even if it is JS … :crazy_face:)

May be you all convice me to look into that JS pile of … what? … we will see :grinning:
After I have invested my time in JS then Xojo will show up with drag+drop finally? Do I only have to wait? Is there any chance? Time is most precious :hourglass:

it seems to me that xojo web listbox already use datatables.net !!!
making a feature request, and asking @Ricardo_Cruz if he thinks it’s possible and in what timeframe…

1 Like

Really? That would be great! :heart_eyes:

could u represent the bubbles in a webcanvas?
and then use two clicks from → to, redraw
instead of dragging?

The answer to your question, Michael Dettmer, is not to be found in this forum and not even with Xojo support. The solution does not exist, that’s for sure.

We’ll have to wait for Xojo engineers to do it someday, if this is even possible.

I am not welcome in this space because I dared to criticize XojoWeb. Users get angry when someone like me criticizes XojoWeb harshly, even the forum administrator asked me to retract it: obviously I did not do it because I did not break any rules.

When users only want 6 stars and the administrator supports it, then democracy does not work and censorship is set in motion.

I managed to do drag and drop with the Web SDK and I was thrilled, it took me several weeks of testing. My smile disappeared when I put it into production, on a service VPS: it does NOT work in production, it only works in the development environment.

I discovered that in development time the frontend and the backend are on the same development PC and that’s why my control worked well because the clipboard is the same in both the frontend and the backend. In production the frontend is on the user’s PC and the backend on the VPS, in that scheme the image is lost during the journey (drag and drop).

But, the problem doesn’t end there. I made a control so that the image saved in a table field would be displayed in a cell of the WebdListBox, but it took a long time to load the grid records. It’s fast when what needs to be displayed is just text, but when it needs to display images in a cell it becomes slow. For this reason, I had to dismiss both objectives: drag and drop and display images in cells.

So, dear Michael Dettmer, be patient and don’t insist so much, there is no democracy or freedom of expression here.

I wish you good luck.

Yes, WebListBox uses DataTables behind the scenes. I’ve just found this old Feature Request that you might want to upvote:

#41852 - Enable WebListBox for Drag & Drop

If there is enough interest, I’ll be more than happy to implement it as soon as possible.

Edit: Ah, wait a second, that Feature Request is about moving rows from one ListBox into another one. I meant reordering rows in the same one. I couldn’t find any generic Drag & Drop Feature Request. But again, if there is enough interest, we can surely add it.

3 Likes

sorry to disapoint you, but I made it more than a year ago and it works in dev and in a prod environment …
I made my own websdk to display lists using bootstrap tables linked to my databases methods and class, then I added drag and drop to reorder the lists it took me half a day.
and it works with 30 users for more than a year now…(not all of them may use drag to reorder a list but…)

5 Likes

Jean-Yves Pochez, if you did it well for you. Congratulations.

I have upvoted!

1 Like

I hope, drag and drop will be in one of the next releases? At least I upvoted - 4 votes up to now? If you read this please upvote:

https://tracker.xojo.com/xojoinc/xojo/-/issues/41852

Reorder is something else and as simple as that for Xojo: Put another boolean into the IDE definition of the listbox called “Re-order” and enter this simple line (2) in the code:


I would appreciate it very much to see that in Xojos next release. Or did I miss anything? Thanks for reading :wink:

We may not taking into account WebListbox with DataSource.
How the re-order work with those? Does make sense with that? or just with WebListboxes without DataSource?