WaveMaker - Widgets API Documentation
  1. Classes
  2. List

File

projects/components/widgets/data/list/src/list.component.doc.ts

Description

The wmList component defines the list widget.

Index

Methods
Inputs

Methods

clear
clear()

Clear method removes all the list items for the list widget.

Returns : void
deselectItem
deselectItem(index: number | Object)

This method allows to deselect a list item in the list widget.

Parameters :
Name Type Optional Description
index number | Object No

Can be an Index(integer) or Model (Object)
Returns : void
getWidgets
getWidgets(widgetName: number, index: number)

This method returns the widget at particular index in the list.

Parameters :
Name Type Optional Description
widgetName number No

Name of the widget.
index number No

The index of the item in the List.
Returns : void
onBeforedatarender
onBeforedatarender(widget: any, $data: Array)

This event handler is called before the list items are rendered on the list widget.

Parameters :
Name Type Optional Description
widget any No

Instance of the list widget
$data Array<any> No

Contains the new list data
Returns : void
onClick
onClick($event: MouseEvent, widget: any)

Callback function which will be triggered when the list item is clicked.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the list widget
Returns : void
onDblclick
onDblclick($event: MouseEvent, widget: any)

Callback function which will be triggered when the list item is double clicked.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the list widget
Returns : void
onDoubletap
onDoubletap($event: TouchEvent, widget: any)

Callback function which will be triggered when the double tap event is triggered on a list item.

Parameters :
Name Type Optional Description
$event TouchEvent No

DOM event on which call back is triggered
widget any No

Instance of the list widget
Returns : void
onKeypress
onKeypress($event: KeyboardEvent, widget: any)

Callback function which will be triggered whenever a key is pressed when a list item is focused.

Parameters :
Name Type Optional Description
$event KeyboardEvent No

DOM event on which call back is triggered
widget any No

Instance of the list widget
Returns : void
onMouseenter
onMouseenter($event: MouseEvent, widget: any)

Callback function which will be triggered when the mouse enters the list item.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the list widget
Returns : void
onMouseleave
onMouseleave($event: MouseEvent, widget: any)

Callback function which will be triggered when the mouse leaves the list item.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the list widget
Returns : void
onPaginationonChange
onPaginationonChange($event: Event, widget: any, $index: number)

This event handler is called when the page is changed through navigation controls.

Parameters :
Name Type Optional Description
$event Event No

DOM event on which call back is triggered
widget any No

Instance of the list widget
$index number No

Current page
Returns : void
onReorder
onReorder($event: MouseEvent, widget: any, $data: Array, $changedItem: Object)

Callback function which will be triggered before the item in a list is reordered.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered
widget any No

Instance of the list widget
$data Array<any> No

Contains the list data with reordered list.
$changedItem Object No

List item that is reordered.
Returns : void
onSelectionlimitexceed
onSelectionlimitexceed($event: Event, widget: any)

Callback function which will be triggered when the items selected cross the specified Selection Limit.

Parameters :
Name Type Optional Description
$event Event No

DOM event on which call back is triggered
widget any No

Instance of the list widget
Returns : void
onSetrecord
onSetrecord($event: Event, widget: any, $index: number, $data: Array)

This event handler is called when the data is set using the pagination.

Parameters :
Name Type Optional Description
$event Event No

DOM event on which call back is triggered
widget any No

Instance of the list widget
$index number No

Current page
$data Array<any> No

Contains the new set of data.
Returns : void
onTap
onTap($event: TouchEvent, widget: any)

Callback function which will be triggered when the tap event is triggered on a list item.

Parameters :
Name Type Optional Description
$event TouchEvent No

DOM event on which call back is triggered
widget any No

Instance of the list widget
Returns : void
selectItem
selectItem(index: number | Object)

This method allows to select a list item in the list widget.

Parameters :
Name Type Optional Description
index number | Object No

Can be an Index(integer) or Model (Object)
Returns : void

Inputs

class
Type : string

Class of the widget.
collapsible
Type : boolean
Default value : false

Enable control for collapsing and expanding the widget when groupby property is set.
dataset
Type : Array<any> | Object

Set this property to a variable to populate the list of values to display.

Bindable: true
dateformat
Type : string

This property determines the date format to be applied on the group heading
direction
Type : string
Default value : 'vertical'

This property determines the direction in which list items have to be arranged. vertical and horizontal are two options available. The default value to this property is vertical.
disableitem
Type : boolean
Default value : false

If the disable selection property is true (checked), selection of List item will not be allowed.

Bindable: true
enablereorder
Type : boolean
Default value : false

This property will allow users to reorder the list items if set to true.

groupby
Type : string

This property allows for grouping the list of rows in the variable bound to a dataset by selecting one of the field names from the drop-down list.
horizontalalign
Type : string

This property specifies how the elements should be aligned horizontally.

Allowed Values: left, center, right

left: Aligns an element to the left.

center: Aligns an element to the center.

right: Aligns an element to the right.
iconclass
Type : string

CSS class of the icon.

Bindable: true
itemclass
Type : string
Default value : 'list-group-item'

This property allows user to select a pre-defined list item class name from the view-list drop down.

Default Options: list-group-item, media

Bindable: true
itemsperrow
Type : string

This property controls the number of list items that are displayed within each row of the list.
listclass
Type : string
Default value : 'list-group'

This property allows user to select a pre-defined list item class name from the view-list drop down.

Default Options: list-group, media-list

Bindable: true
loadingdatamsg
Type : string
Default value : 'Loading...'

This message will be displayed when waiting for data to load.

Bindable: true
loadingicon
Type : string
Default value : 'fa fa-circle-o-notch'

This property can be used to set an icon to be shown while loading records.

Bindable: true
match
Type : string

When "Group as" property is set to

  1. alphabetic, the group heading will contain the starting character of the grouped data key
  2. word, the group heading will contain the word.
  3. any of the TIME options, data is grouped based on the time option given
maxsize
Type : number

Maximum number of items to be displayed in the list.
multiselect
Type : boolean
Default value : false

On checking this property users can select multiple items in list.
name
Type : string

Name of the list widget.
navigation
Type : string
Default value : 'Basic'

Select the pagination type for the widget.

Allowed Values: Basic, Pager, Classic, Scroll, Inline, None, On-Demand

Basic: This option gives a next and previous arrow along with the page numbers at the bottom of the page.

Pager: This option gives a next and previous buttons at the bottom of the page for pagination.

Classic: A bar with total number of pages and number of items in the current page will be displayed, along with arrows for pagination.

Scroll: On the scroll over the list will cause the next page to load and display.

Inline: This option gives a next and previous arrows at both the sides of the page for pagination, carousel style.

None: No pagination will be provided.

On-Demand: List items loads on demand by clicking on the "load more" button.
navigationalign
Type : string
Default value : 'left'

This property specifies how the paginator should be aligned horizontally.

Allowed Values: left, center, right

left: Aligns paginator to the left.

center: Aligns paginator to the center.

right: Aligns paginator to the right.
nodatamessage
Type : string
Default value : 'No data found.'

This message will be displayed when there is no data to display.

Bindable: true
ondemandmessage
Type : string
Default value : 'Load More'

The property can be used to customize the on demand navigation message.

Bindable: true
orderby
Type : string

Allows to display the data in asc or desc order based on this property.
pagesize
Type : number
Default value : 20

This property sets the maximum number of items to display on each page of the list.
paginationclass
Type : string

This property allows user style pagination class.
selectfirstitem
Type : boolean
Default value : false

If this property is enabled, the first item of the list will be selected automatically when the livelist is displayed.

Bindable: true
selectionlimit
Type : number

This property will allow users to select only a limited number of items.

Bindable: true
show
Type : boolean
Default value : true

This property will be used to show/hide the list widget.

Bindable: true
showcount
Type : boolean
Default value : false

Count of list items in list group will be shown, if set to true
showrecordcount
Type : boolean
Default value : false

This property controls whether the total record count is displayed in the data paginator or not.
subheading
Type : string

Subheading of the list widget.

Bindable: true
tabindex
Type : number
Default value : 0

This property specifies the tab order of the list widget.
title
Type : string

Tile of the list widget.

Bindable: true

results matching ""

    No results matching ""