Configuration

An object defining configuration options for the widget.

elementAttr

Specifies the attributes to be attached to the widget's root element.

Type:

Object

Default Value: {}

You can configure this option in an ASP.NET MVC Control as follows:

Razor C#
Razor VB
@(Html.DevExtreme().WidgetName()
    .ElementAttr("class", "class-name")
    // ===== or =====
    .ElementAttr(new {
        @id = "elementId",
        @class = "class-name"
    })
    // ===== or =====
    .ElementAttr(new Dictionary<string, object>() {
        { "id", "elementId" },
        { "class", "class-name" }
    })

)
@(Html.DevExtreme().WidgetName() _
    .ElementAttr("class", "class-name")
    ' ===== or =====
    .ElementAttr(New With {
        .id = "elementId",
        .class = "class-name"
    })
    ' ===== or =====
    .ElementAttr(New Dictionary(Of String, Object) From {
        { "id", "elementId" },
        { "class", "class-name" }
    })
)

hoverStateEnabled

Specifies whether the widget changes its state when a user pauses on it.

Type:

Boolean

Default Value: false

items

An array of items displayed by the widget.

Type:

Array<String | Object>

Generally, the array of items is auto-generated when a validation result is ready. And if you set a custom array of items, it will be overridden by the auto-generated array. So use this option to read the current array of items. Alternatively, you can set the array of items generated by a custom validation engine.

itemTemplate

Specifies a custom template for items.

Type:

template

Function parameters:
itemData:

Object

The item object to be rendered.

itemIndex:

Number

The index of the item to be rendered.

itemElement:

Element (jQuery or HTML)

The container of the item to be rendered.

Return Value:

String

|

DOM Node

|

jQuery

A template name or container.

Default Value: 'item'
See Also

onContentReady

A handler for the contentReady event. Executed when the widget's content is ready. This handler may be executed multiple times during the widget's lifetime depending on the number of times its content changes.

Type:

function

Function parameters:
e:

Object

Information about the event.

Object structure:
component:

Object

The widget's instance.

element:

Element (jQuery or HTML)

The widget's container.

model:

Object

The model data. Available only when using Knockout.

Default Value: null

onDisposing

A handler for the disposing event. Executed when the widget is removed from the DOM using the remove(), empty(), or html() jQuery methods only.

Type:

function

Function parameters:
e:

Object

Information about the event.

Object structure:
component:

Object

The widget's instance.

element:

Element (jQuery or HTML)

The widget's container.

model:

Object

The model data. Available only if you use Knockout.

Default Value: null

onInitialized

A handler for the initialized event. Executed only once, after the widget is initialized.

Type:

function

Function parameters:
e:

Object

Information about the event.

Object structure:
component:

Object

The widget's instance.

element:

Element (jQuery or HTML)

The widget's container.

Default Value: null

You cannot access widget elements in this handler because it is executed before they are ready. Use the onContentReady handler instead.

onItemClick

A handler for the itemClick event.

Type:

function

|

String

Function parameters:
e:

Object

Information about the event.

Object structure:
component:

Object

The widget's instance.

element:

Element (jQuery or HTML)

The widget's container.

model:

Object

The model data. Available only if you use Knockout.

itemData:

Object

The clicked item's data.

itemElement:

Element (jQuery or HTML)

The item's container.

itemIndex:

Number

The clicked item's index.

jQueryEvent:

jQuery.Event

The jQuery event that caused the handler execution. Deprecated in favor of the event field.

event:

Event (jQuery or dxEvent)

The event that caused the handler execution. It is a dxEvent or a jQuery.Event when you use jQuery.

Default Value: null

Assign a function to perform a custom action when a widget item is clicked.

To navigate to a specific URL when the itemClick event fires, assign that URL or the anchor part (#) of that URL directly to this option as a string.

onOptionChanged

A handler for the optionChanged event. Executed after an option of the widget is changed.

Type:

function

Function parameters:
e:

Object

Information about the event.

Object structure:
component:

Object

The widget's instance.

name:

String

The option's short name.

fullName:

String

The option's full name.

value: any

The option's new value.

element:

Element (jQuery or HTML)

The widget's container.

model:

Object

The model data. Available only if you use Knockout.

Default Value: null

validationGroup

Specifies the validation group for which summary should be generated.

Type:

String

In the Knockout approach, the ValidationSummary widget should be added to the div element representing the ValidationGroup component. In this instance, you do not have to specify the validationGroup option for the ValidationSummary widget.

If you use the JQuery approach, the validationGroup option should be specified for the ValidationSummary widget to generate a summary for a particular validation group. Assign the validation group name that is specified for the validationGroup option of the validators that extend the editors to be validated.