JAVASCRIPT EXAMPLES Dynamic Collection
In this example, an instance of the Uize.Widget.Collection.Dynamic widget class is being used to wire up an editable grid of photos. You can select items in the grid by clicking on them. You can make a non-contiguous selection by ctrl-clicking on items. You can make a range selection by clicking on one item and then shift-clicking on another. Use the "SELECT NONE" button above the grid to clear a selection, or use the "SELECT ALL" button to select all the items. With some items selected, click the "REMOVE" button to remove the selected items. Also with a selection, click-and-drag to reposition the selected items within the collection.
Each item in the grid utilizes the Uize.Widget.CollectionItem widget class. This limited utilization of the Uize.Widget.Collection.Dynamic class is not connected up to an application, so there are no consequences to reordering or removing items. To restore the grid contents, just reload the page.