[external] Editable row id of the item list and changing the order of the rows

External content by Karol Częczek; October 21, 2024; 

If you need to manage and change the order of items added to the list, you can achieve this by adding your editable ID column and JavaScript code.

A short video shows the end result of the modifications added to the list.

To begin with, we add 2 columns: ID and T_ID, of type Floating-point number to the list, set them as default value : Ordinal number, and change the configuration as in the attached screenshots.

ID:

T_ID:

Next, we create 2 JavaScript form rules

FRJ_Moveable_List_ID_SET

FRJ_Moveable_List_Delete:

We add in the configuration of the change item list:
- Deselect showing system ID
- We set the FRJ_Moveable_List_Delete rule to callback
- We set the sorting by our created ID column

On our created ID attribute in the Style and behavior tab, we add a rule as shown in the screenshot below.

On the Main form element under the Behavior tab, add a rule that hides the technical column T_ID

After performing these steps, we should get the effect shown at the beginning of the article.
We can still add a script that will position the cursor in, for example, the first column of the added row.

FRJ_Focus_List_Picker

Set the rule in the list configuration

This script will set our cursor in the newly added row in the defined column, as shown in the screenshot below.
The script works for a column of text row type, if we want to set focus in a column such as picker we need to modify the script.