AtomListBox

AtomListBox is derived from AtomItemsControl, it acts as ListBox and DataGrid. Providing simple itemTemplate makes it work like ListBox and providing Table as template makes it look like DataGrid. Other classes like AtomToggleButtonBar and AtomLinkBar are derived from AtomListBox and their styles and templates are different.

AutoSelectOnClick

By default this is true, it means, when any part of item is clicked, item will be selected. However if you need only one button or checkbox to work for selection, then it can be customized in following ways.

Note: To set any atom property as false, it must always be set in curley braces so that we identify it as javascript expression, otherwise in javascript string with "false" is considered as true.

Using Button as Selector

Using Checkbox as Selector for Multiple Selection

Display as DataGrid

DataGrid with Sorting

In this example, sorting is performed at client side, however if you want sorting to be performed at server side, all you have to do is bind $scope.sortPath in AtomPromise.json method's query parameter.

 

UI Virtualize

In order to turn on UI Virtualization, you can set ui-virtualize to true and you have to specify either virtualContainer or itemsPresenter

As table