File

projects/components/src/widgets/common/chips/chips.component.doc.ts

Description

The wmChips component defines the chips widget.

Index

Methods
Inputs

Methods

onAdd
onAdd($event: MouseEvent, widget: any, $item: Object)

Callback function which will be triggered on chip addition.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget

$item Object No

object containing chip data i.e. label(display value), key, value(datavalue), dataObject. dataObject has the object if dataset is bound to array of objects.

Returns : void
onBeforeadd
onBeforeadd($event: MouseEvent, widget: any, newItem: Object)

Callback function which will be triggered before adding the chip. If this function returns false then chip will not be added.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget

newItem Object No

object containing chip data i.e. label(display value), key, value(datavalue), dataObject. dataObject has the object if dataset is bound to array of objects.

Returns : void
onBeforeremove
onBeforeremove($event: MouseEvent, widget: any, $item: Object)

Callback function which will be triggered before removing the chip. If this function returns false then chip will not be removed.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget

$item Object No

object containing chip data before removing the chip.

Returns : void
onBeforereorder
onBeforereorder($event: MouseEvent, widget: any, $data: Array, $changedItem: Object)

Callback function which will be triggered before the chip item is reordered.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget

$data Array<Object> No

contains the list of chips data

$changedItem Object No

chip item that has to be reordered.

Returns : void
onBeforeservicecall
onBeforeservicecall(widget: any, inputData: Object)

Callback function which will be triggered before the service call.

Parameters :
Name Type Optional Description
widget any No

Instance of the chips widget

inputData Object No

object containing filter fields

Returns : void
onChange
onChange($event: MouseEvent, widget: any, newVal: Array, oldVal: Array)

Callback function which will be triggered when datavalue has changed.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget

newVal Array<any> No

datavalue of the chips widget

oldVal Array<any> No

previously selected datavalue of the chips widget

Returns : void
onChipclick
onChipclick($event: MouseEvent, widget: any, newVal: Object)

Callback function which will be triggered when chip is clicked.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget *

newVal Object No

contains the chip data.

Returns : void
onChipselect
onChipselect($event: MouseEvent, widget: any, newVal: Object)

Callback function which will be triggered upon chip selection.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget

newVal Object No

contains the selected chip data.

Returns : void
onRemove
onRemove($event: MouseEvent, widget: any, $item: Object)

Callback function which will be triggered on removing chip.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget

$item Object No

object containing chip data that is removed from chips list.

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

Callback function which will be triggered on reordering of chips.

Parameters :
Name Type Optional Description
$event MouseEvent No

DOM event on which call back is triggered

widget any No

Instance of the chips widget

$data Array<Object> No

contains the list of chips data

$changedItem Object No

chip item that is reordered.

Returns : void

Inputs

allowonlyselect

This property will restrict adding values other than the values in the dropdown, if set to true. By default there is no restriction

Type : boolean

Default value : false

autofocus

This property makes the widget get focused automatically when the page loads.

Type : boolean

Default value : false

chipclass

Class to be applied on each of the chip item.

Bindable: true

Type : string

class

Class of the widget.

Type : string

datafield

This property sets the dataValue to be returned by the chips widget when the list is populated using the dataSet property.

Type : string

dataset

Type : Array<any> | Object

Default value : 'Option 1, Option 2, Option 3'

datavalue

This property defines the initial selected value of the chips widget. This adds the default chip items.
This accept an array of values too. This value has to be of type as that of the property specified for datafield. If datafield is ALL FIELDS, then pass an object or array of objects to datavalue.

Bindable: true

Type : any

disabled

This property will be used to disable the chips widget. If the disabled property is true (checked), the widget becomes display-only.

Bindable: true

Type : boolean

displayexpression

This is an advanced property that gives more control over what is displayed in the drop-down select list. A Display Expression uses a JavaScript expression to format exactly what is shown

Bindable: true

Type : string

displayfield

This property sets the displayValue to show in the chip's search results when the list is populated using the dataSet property.

Type : string

displayimagesrc

Picture source sets the image to be displayed in the search results.

Bindable: true

Type : string

enablereorder

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

Bindable: true

Type : boolean

limit

This property limits the search results to be displayed in the widget

Type : number

minchars

The minchars attribute specifies the number of characters that need to be entered before the query is triggered. It must be greater than or equal to 0.

Type : number

Default value : 1

name

Name of the chips widget.

Type : string

orderby

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

Type : string

placeholder

This property specifies the placeholder for the search input in chips.

Bindable: true

Type : string

query

This property contains the entered text in the search input of chips.

Type : string

readonly

This property will be used to make the chips widget non-editable.

Bindable: true

Type : boolean

searchkey

This is the property to be searched upon, in the dataset

Type : string

shortcutkey

The shortcut key property specifies a shortcut key to activate/focus an element.

Type : string

show

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

Bindable: true

Type : boolean

Default value : true

showsearchicon

This property shows the search icon when set to true. This value is false when type is set to autocomplete.

Type : boolean

tabindex

This property specifies the tab order of the Chip widget.

Type : number

Default value : 0

type

This property specifies type of search to be shown in the chips.

Allowed Values: search, autocomplete

search: Atleast one character has to be entered to trigger the search query.

autocomplete: automatically triggers the query when the search is focused.

Type : string

Default value : 'search'

result-matching ""

    No results matching ""