Vue TreeList - editing.texts

Contains properties that specify texts for editing-related UI elements.

Selector: DxTexts
Type:

EditingTexts

The following code shows the editing.texts declaration syntax:

jQuery
index.js
$(function() {
    $("#treeListContainer").dxTreeList({
        // ...
        editing: {
            // ...
            texts: {
                deleteRow: "Remove"
            }
        }
    });
});
Angular
app.component.html
app.component.ts
app.module.ts
<dx-tree-list ... >
    <dxo-editing ... >
        <dxo-texts
            deleteRow="Remove">
        </dxo-texts>
    </dxo-editing>
</dx-tree-list>
import { Component } from '@angular/core';

@Component({
    selector: 'app-root',
    templateUrl: './app.component.html',
    styleUrls: ['./app.component.css']
})
export class AppComponent {
    // ...
}
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';

import { DxTreeListModule } from 'devextreme-angular';

@NgModule({
    declarations: [
        AppComponent
    ],
    imports: [
        BrowserModule,
        DxTreeListModule
    ],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }
Vue
App.vue
<template>
    <DxTreeList ... >
        <DxEditing ... >
            <DxTexts
                delete-row="Remove"
            />
        </DxEditing>
    </DxTreeList> 
</template>

<script>
import 'devextreme/dist/css/dx.light.css';

import DxTreeList, {
    DxEditing,
    DxTexts
} from 'devextreme-vue/tree-list';

export default {
    components: {
        DxTreeList,
        DxEditing,
        DxTexts
    },
    data() {
        // ...
    }
}
</script>
React
App.js
import React from 'react';

import 'devextreme/dist/css/dx.light.css';

import TreeList, {
    Editing,
    Texts
} from 'devextreme-react/tree-list';

class App extends React.Component {
    render() {
        return (
            <TreeList ... >
                <Editing>
                    <Texts
                        deleteRow="Remove"
                    />
                </Editing>
            </TreeList>
        );
    }
}
export default App;

addRow

Specifies text for a hint that appears when a user pauses on the global "Add" button. Applies only if editing.allowAdding is true.

Selector: add-row
Type:

String

Default Value: 'Add a row'

addRowToNode

Specifies text for the button that adds a new nested row. Applies if the editing.mode is "batch" or "cell".

Selector: add-row-to-node
Type:

String

Default Value: 'Add'

cancelAllChanges

Specifies text for a hint that appears when a user pauses on the "Discard" button. Applies only if editing.mode is "batch".

Selector: cancel-all-changes
Type:

String

Default Value: 'Discard changes'

cancelRowChanges

Specifies text for a button that cancels changes in a row. Applies only if editing.allowUpdating is true and editing.mode is "row", "popup" or "form".

Selector: cancel-row-changes
Type:

String

Default Value: 'Cancel'

confirmDeleteMessage

Specifies a message that prompts a user to confirm deletion.

Selector: confirm-delete-message
Type:

String

Default Value: 'Are you sure you want to delete this record?'

A window that displays this message appears when a user tries to delete a row, or when you call the deleteRow(rowIndex) method in code. To prevent this window from appearing, set the confirmDelete property to false.

See Also

confirmDeleteTitle

Specifies a title for the window that asks a user to confirm deletion.

Selector: confirm-delete-title
Type:

String

Default Value: ''

See Also

deleteRow

Specifies text for buttons that delete rows. Applies only if allowDeleting is true.

Selector: delete-row
Type:

String

Default Value: 'Delete'

editRow

Specifies text for buttons that switch rows into the editing state. Applies only if allowUpdating is true.

Selector: edit-row
Type:

String

Default Value: 'Edit'

saveAllChanges

Specifies text for a hint that appears when a user pauses on the global "Save" button. Applies only if editing.mode is "batch".

Selector: save-all-changes
Type:

String

Default Value: 'Save changes'

saveRowChanges

Specifies text for a button that saves changes made in a row. Applies only if allowUpdating is true and editing.mode is "row", "popup" or "form".

Selector: save-row-changes
Type:

String

Default Value: 'Save'

undeleteRow

Specifies text for buttons that recover deleted rows. Applies only if allowDeleting is true and editing.mode is "batch".

Selector: undelete-row
Type:

String

Default Value: 'Undelete'

validationCancelChanges

Specifies text for a hint appearing when a user pauses on the button that cancels changes in a cell. Applies only if editing.mode is "cell" and data validation is enabled.

Selector: validation-cancel-changes
Type:

String

Default Value: 'Cancel changes'

See Also