0

I have a webgallery (made with laravel) and would like to add the possibility to reorder the images... Now, I have thought of several approaches but for every aproach i find that there should be a better way of doing it.

the gallery does not use javascript, so ones changes have been made it needs to be sumbitted and reloaded to reflect the changes

The main difficulties are:

  • how to store the order in the database? an additional Integer column?
  • how to add a picture "between" two others?
  • how to handle it at a frontend level?

So far the best ideas I had are these:

  • a column with integers, order by clause on this column. Frontend: a move up and a move down button.

    • problems of this solution: it needs a refresh after each single movement. it needs to identify the previous/next picture and swap the number with that one. To move a single pic from the end of the gallery to the top it takes forever.

  • a column with integers, automatically prefilled in steps of 100, order by this column + upload time in case of same numbers, Frontend: a textbox where the user can specify the integers for each picture and a submit button.

    • problems of this solution: does not look very professional. solves all the problems of the previous solution

  • same as previous solution but with double values to be able to insert pictures without limits.

They all dont seem the real deal.. Any sugestion on how to do it properly is welcome. thanks

sharkyenergy
  • 3,842
  • 10
  • 46
  • 97

1 Answers1

1

I have done that kind of sorting in OpenCart products list (custom backend design)

Sort order was additional column order INT(11) in database

We had 3 input fields: up/down/custom

Where custom was dropdown of all indexes from 1 to max-items.

All inputs does the same:

Take new order value and shift all elements except itself. Up or down shift depends if you move element to front or to back of current position

UPDATE order FROM products SET order = :newOrder WHERE id = :currentItemId

if ($newOrder > $oldOrder)
    UPDATE order FROM products SET order + 1 WHERE order >= :newOrder AND id != :currentItemId
else
    UPDATE order FROM products SET order - 1 WHERE order <= :newOrder AND id != :currentItemId

Inserting does the same update, just first query becomes INSERT INTO

To get rid of ugly refresh of page on every action we do Ajax requests and re-sorted DOM with jQuery

Justinas
  • 41,402
  • 5
  • 66
  • 96