Skip to main content
A
Anonymous
September 27, 2011
Question

Where to start with drag and drop to change order of items

  • September 27, 2011
  • 1 reply
  • 4825 views

I have this CMS, different categories. Each category contains several images. People click on the category they want to change and then see all the images. I need to make there a drag and drop system so clients can change order in which items are showed on their website. The order is written to the database.

People say to me, hell you should use AJAX. There are many AJAX versions and exemples and I don't know where to start. I googled on drag drop coldfusion but the more I read the more confused I get. I am no good at javascript and I am sort of panicking. I know though I should find a way to get comfortable with it.

Can you please point me in the right direction, where to start, what method to chose?

Thanks in advance for any help.

    This topic has been closed for replies.

    1 reply

    Owainnorth
    Owainnorth
    Inspiring
    September 27, 2011

    Drag & drop is a client-side technology, so ColdFusion is of no use whatsoever. This leaves you with the following options:

    Javascript.

    That's it. You'll need a CF webservice of some description if, as you say, you want to save settings to a database but one step at a time eh? To be honest, that's a major undertaking if you don't know what to do. Hell, I've been doing this for years, and I reckon I'd seriously struggle writing something like that.

    Now servers are quicker and so are internet connections, I'd suggest just having up/down hyperlinks under each image, which then refresh the page, call to the database to move that image's priority up or down, then re-display the page. As long as the image titles don't change the browser will keep them cached anyway so the page won't take long to load at all.

    Not perfect I know, but a thousand times easier than what you'd be trying to implement with JS.

    A
    Anonymous
    September 27, 2011

    Hi Owain,

    This is exactly how it works now, image, description, arrow left, arrow right and it works. But my client wants more:-) As a compromise the new order doesn't need to be written to db after each move. We can let people move around with images and then let them click submit button to save new order when they are finished.

    J
    Joshua_Cyr
    Participating Frequently
    September 27, 2011

    Just use jquery sortable or something similar to allow someone to sort a

    list of items. When you then save (or on every drop) you can then send the

    updated new list of ID numbers to your CF page.

    http://www.simonbattersby.com/blog/drag-and-drop-with-jquery-ui/

    There are a few examples with PHP out there, which should get you the right

    idea.

    Terms & ConditionsAccessibility statement
    Using the community Terms of use Privacy Cookie preferences Do not sell or share my personal information ad choicesAdChoices