File

projects/components/src/widgets/common/list/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

Class of the widget.

Type : string

collapsible

Enable control for collapsing and expanding the widget when groupby property is set.

Type : boolean

Default value : false

dataset

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

Bindable: true

Type : Array<any> | Object

dateformat

This property determines the date format to be applied on the group heading

Type : string

disableitem

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

Bindable: true

Type : boolean

Default value : false

enablereorder

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

Type : boolean

Default value : false

groupby

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.

Type : string

horizontalalign

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.

Type : string

iconclass

CSS class of the icon.

Bindable: true

Type : string

itemclass

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

Type : string

Default value : 'list-group-item'

itemsperrow

This property controls the number of list items that are displayed within each row of the list.

Type : string

listclass

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

Type : string

Default value : 'list-group'

loadingdatamsg

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

Bindable: true

Type : string

Default value : 'Loading...'

loadingicon

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

Bindable: true

Type : string

Default value : 'fa fa-circle-o-notch'

match

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

Type : string

maxsize

Maximum number of items to be displayed in the list.

Type : number

multiselect

On checking this property users can select multiple items in list.

Type : boolean

Default value : false

name

Name of the list widget.

Type : string

navigation

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.

Type : string

Default value : 'Basic'

navigationalign

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.

Type : string

Default value : 'left'

nodatamessage

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

Bindable: true

Type : string

Default value : 'No data found.'

ondemandmessage

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

Bindable: true

Type : string

Default value : 'Load More'

orderby

Allows to display the data in asc or desc order based on this property.

Type : string

pagesize

This property sets the maximum number of items to display on each page of the list.

Type : number

Default value : 20

paginationclass

This property allows user style pagination class.

Type : string

selectfirstitem

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

Bindable: true

Type : boolean

Default value : false

selectionlimit

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

Bindable: true

Type : number

show

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

Bindable: true

Type : boolean

Default value : true

showcount

Count of list items in list group will be shown, if set to true

Type : boolean

Default value : false

showrecordcount

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

Type : boolean

Default value : false

subheading

Subheading of the list widget.

Bindable: true

Type : string

tabindex

This property specifies the tab order of the list widget.

Type : number

Default value : 0

title

Tile of the list widget.

Bindable: true

Type : string

result-matching ""

    No results matching ""