Skip to Main Content

Drag & Drop tabular form rows

Here is how drag & Drop tabular form rows to order records how you like.This solution works for tabular forms where you do not use pagination on APEX 4.1. Your table need have column that store display sequence id. If your table do not have column that can be used for this, alter your table and add column.

ALTER TABLE your_table ADD (display_seq NUMBER);

Go into the report attributes of your tabular form. On the right hand side of the page you will see Tasks. In there click Add Derived Column. Edit derived column attributes and change Display As to Standard Report Column. Add to Column Formatting HTML Expression:

Add to Column Formatting HTML Expression:

<img class="sort-row" src="#IMAGE_PREFIX#ws/sort.gif" alt="" />

Next uncheck all Sort checkboxes from report attributes and add order by to your report query:

ORDER BY display_seq

Create dynamic Action. Select Advanced

  • Name: Set Form Ordering
  • Event: After Refresh
  • Selection Type: Region
  • Region: {select your report region}
  • Condition: No Condition
  • Action: Execute JavaScript code
  • Fire On Page Load: True
  • Code:
 cursor: "move",
 handle: "img.sort-row",
 items: "tr:not(:first)",
 containment: ".report-standard",
 axis: "y",
 opacity: 0.9,
 revert: true,
 helper: function(e,u){
 return u;
  • Selection Type: None

Create PL/SQL process On Submit - After Computations and Validations:

  UPDATE emp SET display_seq = i WHERE rowid = APEX_APPLICATION.G_FROWID(i);

Add to page HTML Header:

<script type="text/javascript" src="#IMAGE_PREFIX#libraries/jquery-ui/1.8.14/ui/minified/jquery.ui.sortable.min.js"></script>

NOTE ! If you are on APEX 5:
Instead of adding jQuery UI library to HTML header, place below to page JavaScript file URLs


See working example.


  • Jari Laine 21 Aug 2023

    Ajin, for support touch events, you could try jQuery UI Touch Punch.


  • Jari Laine 19 Aug 2023

    Hi Chris,

    Please see instructions for IG from new blog post Drag & Drop Interactive Grid rows.


  • Chris 18 Aug 2023

    Thank you for replying Jari,
    I figured as well. Can you give me a quick explanation how did you do it in your example or if I can download it and look myself meanwhile?
    Thanks for replying again!

  • Jari Laine 18 Aug 2023

    Hi Chris,

    Unfortunately, these blog post instructions do not work directly with Interactive Grid. For example, in IG I didn't use the apex_item package, and the process to loop apex_application.g_f_xx array is not needed.

    I will try to write a new blog post for IG in the near future.


  • Chris 18 Aug 2023

    Few hours later and I managed to do the drag and drop part for my IG.
    But now I'm having problems with updating the db column.
    I followed everything but it seems that the array is not filling up.
    APEX_ITEM.HIDDEN( 10, MY_PK ) as SORT_PK is in my select
    After Submit Procces:'Start updating display sequences %s rows', APEX_APPLICATION.G_F10.COUNT);
    for i in 1 .. APEX_APPLICATION.G_F10.count
     update my_table 
       set display_seq = i 
     where my_pk = APEX_APPLICATION.G_F10(i);
    end loop;

    ..Process "After Submit" - Type: NATIVE_PLSQL
    ..statement empty or no bind variables found. exiting.
    ..Start updating display sequences 0 rows
    Tried few things but I have no idea why f10 is empty. When I unhide SORT_PK the values are shown like this inside the grid:
    < input type="hidden" name="f10" value="test"
    Any ideas?

  • Chris 18 Aug 2023

    Hey I see you have a working example for a Grid but I can't find how u did it there. Can you please help? :)

  • Jari Laine 14 Aug 2023

    Hi Ajin,

    Yes, you are correct. You can make it support touch events and share your solution.


  • Ajin 14 Aug 2023

    This solution doesnt work on touch based devices. Tried on ipad.

  • Jari Laine 3 Aug 2023

    Hi Ajin,

    Never done that, but I'm sure it can be done.

    Here is one jQuery plugin that you could check and integrate it to APEX

    Maybe help of that you create APEX dynamic action plugin.


  • Ajin 3 Aug 2023

    is it possible to make two columns static and others are draggable ?