React ValidationGroup Props
height
This property accepts a value of one of the following types:
Number
The height in pixels.String
A CSS-accepted measurement of height. For example,"55px"
,"20vh"
,"80%"
,"inherit"
.Function (deprecated since v21.2)
Refer to the W0017 warning description for information on how you can migrate to viewport units.
onDisposing
A function that is executed before the UI component is disposed of.
Name | Type | Description |
---|---|---|
element |
The UI component's container. It is an HTML Element or a jQuery Element when you use jQuery. |
|
component |
The UI component's instance. |
onInitialized
Name | Type | Description |
---|---|---|
element |
The UI component's container. It is an HTML Element or a jQuery Element when you use jQuery. |
|
component |
The UI component's instance. |
- <dx-validation-group ...
- (onInitialized)="saveInstance($event)">
- </dx-validation-group>
- import { Component } from "@angular/core";
- import ValidationGroup from "devextreme/ui/data_grid";
- // ...
- export class AppComponent {
- validationGroupInstance: ValidationGroup;
- saveInstance (e) {
- this.validationGroupInstance = e.component;
- }
- }
See Also
- Get a UI component Instance in Angular
onOptionChanged
Name | Type | Description |
---|---|---|
value | any |
The modified property's new value. |
previousValue | any |
The UI component's previous value. |
name |
The modified property if it belongs to the first level. Otherwise, the first-level property it is nested into. |
|
fullName |
The path to the modified property that includes all parent properties. |
|
element |
The UI component's container. It is an HTML Element or a jQuery Element when you use jQuery. |
|
component |
The UI component's instance. |
The following example shows how to subscribe to component property changes:
- <dx-validation-group ...
- (onOptionChanged)="handlePropertyChange($event)">
- </dx-validation-group>
- import { Component } from '@angular/core';
- @Component({
- selector: 'app-root',
- templateUrl: './app.component.html',
- styleUrls: ['./app.component.css']
- })
- export class AppComponent {
- // ...
- handlePropertyChange(e) {
- if(e.name === "changedProperty") {
- // handle the property change here
- }
- }
- }
- import { BrowserModule } from '@angular/platform-browser';
- import { NgModule } from '@angular/core';
- import { AppComponent } from './app.component';
- import { DxValidationGroupModule } from 'devextreme-angular';
- @NgModule({
- declarations: [
- AppComponent
- ],
- imports: [
- BrowserModule,
- DxValidationGroupModule
- ],
- providers: [ ],
- bootstrap: [AppComponent]
- })
- export class AppModule { }
width
This property accepts a value of one of the following types:
Number
The width in pixels.String
A CSS-accepted measurement of width. For example,"55px"
,"20vw"
,"80%"
,"auto"
,"inherit"
.Function (deprecated since v21.2)
Refer to the W0017 warning description for information on how you can migrate to viewport units.
If you have technical questions, please create a support ticket in the DevExpress Support Center.