All docs
V19.2
24.2
The page you are viewing does not exist in version 24.2.
24.1
The page you are viewing does not exist in version 24.1.
23.2
The page you are viewing does not exist in version 23.2.
23.1
The page you are viewing does not exist in version 23.1.
22.2
The page you are viewing does not exist in version 22.2.
22.1
The page you are viewing does not exist in version 22.1.
21.2
The page you are viewing does not exist in version 21.2.
21.1
The page you are viewing does not exist in version 21.1.
20.2
The page you are viewing does not exist in version 20.2.
20.1
The page you are viewing does not exist in version 20.1.
19.2
19.1
18.2
18.1
17.2
A newer version of this page is available. Switch to the current version.

JavaScript/jQuery ValidationGroup Options

An object defining configuration options for the ValidationGroup widget.

See Also

elementAttr

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

Type:

Object

Default Value: {}

jQuery
$(function(){
    $("#validationGroupContainer").dxValidationGroup({
        // ...
        elementAttr: {
            id: "elementId",
            class: "class-name"
        }
    });
});
Angular
HTML
TypeScript
<dx-validation-group ...
    [elementAttr]="{ id: 'elementId', class: 'class-name' }">
</dx-validation-group>
import { DxValidationGroupModule } from "devextreme-angular";
// ...
export class AppComponent {
    // ...
}
@NgModule({
    imports: [
        // ...
        DxValidationGroupModule
    ],
    // ...
})
Vue
App.vue
<template>
    <DxValidationGroup ...
        :element-attr="validationGroupAttributes">
    </DxValidationGroup>
</template>

<script>
import DxValidationGroup from 'devextreme-vue/validation-group';

export default {
    components: {
        DxValidationGroup
    },
    data() {
        return {
            validationGroupAttributes: {
                id: 'elementId',
                class: 'class-name'
            }
        }
    }
}
</script>
React
App.js
import React from 'react';

import ValidationGroup from 'devextreme-react/validation-group';

class App extends React.Component {
    validationGroupAttributes = {
        id: 'elementId',
        class: 'class-name'
    }

    render() {
        return (
            <ValidationGroup ...
                elementAttr={this.validationGroupAttributes}>
            </ValidationGroup>
        );
    }
}
export default App;

height

Specifies the widget's height.

Type:

Number

|

String

|

Function

Return Value:

Number

|

String

The widget's height.

Default Value: undefined

This option accepts a value of one of the following types:

  • Number
    The height in pixels.

  • String
    A CSS-accepted measurement of height. For example, "55px", "80%", "inherit".

  • Function
    A function returning either of the above. For example:

    JavaScript
    height: function() {
        return window.innerHeight / 1.5;
    }

onDisposing

A function that is executed before the widget is disposed of.

Type:

Function

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

ValidationGroup

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

model

Object

Model data. Available only if you use Knockout.

Default Value: null

onInitialized

A function used in JavaScript frameworks to save the widget instance.

Type:

Function

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
component

ValidationGroup

The widget's instance.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

Default Value: null

See Also

onOptionChanged

A function that is executed after a widget option is changed.

Type:

Function

Function parameters:
e:

Object

Information about the event.

Object structure:
Name Type Description
model

Object

Model data. Available only if you use Knockout.

fullName

String

The path to the modified option that includes all parent options.

element

HTMLElement | jQuery

The widget's container. It is an HTML Element or a jQuery Element when you use jQuery.

component

ValidationGroup

The widget's instance.

name

String

The modified option if it belongs to the first level. Otherwise, the first-level option it is nested into.

value any

The modified option's new value.

Default Value: null

width

Specifies the widget's width.

Type:

Number

|

String

|

Function

Return Value:

Number

|

String

The widget's width.

Default Value: undefined

This option accepts a value of one of the following types:

  • Number
    The width in pixels.

  • String
    A CSS-accepted measurement of width. For example, "55px", "80%", "auto", "inherit".

  • Function
    A function returning either of the above. For example:

    JavaScript
    width: function() {
        return window.innerWidth / 1.5;
    }