List Group Task

This is a bootstrap list group that has been customized to contain Anvil Checkboxes which are also sortable. This makes for a good task list which can be rearranged and checked off or any other such component.

Adding elements

The list group task form is called ListGroupTask and it can be added just like any other component, but you need to set the list_group_task_number to a unique number. You can add an element by calling the add_list_item Javascript function.

• list_group_task_number - this is to identify the correct list group.

• dom_element - this is to the component that you want to add as it exists in the dom. You can get the dom_element in Anvil by using the following line of code anvil.js.get_dom_node() with the component being the parameter passed into the method.

• item_number - this is the unique item that you save with each row in your database, so each row in the list group can be referenced if the positions are changed.

You can add whichever elements you want such as Checkbox, Label or any other Anvil component as long as you pass in the dom element and not the actual component.

Sortable

The list group task form is sortable which will also save the new positions to the database automatically. The handle of the task list items is any label which is on the item, which allows for reordering on desktop as well as mobile while keeping the area scrollable. When you check the checkbox, it will also be saved automatically to the database.