JavaScript/jQuery Chat Options

activeStateEnabled

alerts

dataSource

disabled

elementAttr

$(function(){
    $("#chatContainer").dxChat({
        // ...
        elementAttr: {
            id: "elementId",
            class: "class-name"
        }
    });
});

<dx-chat ...
    [elementAttr]="{ id: 'elementId', class: 'class-name' }">
</dx-chat>

import { DxChatModule } from "devextreme-angular";
// ...
export class AppComponent {
    // ...
}
@NgModule({
    imports: [
        // ...
        DxChatModule
    ],
    // ...
})

<template>
    <DxChat ...
        :element-attr="chatAttributes">
    </DxChat>
</template>

<script>
import DxChat from 'devextreme-vue/chat';

export default {
    components: {
        DxChat
    },
    data() {
        return {
            chatAttributes: {
                id: 'elementId',
                class: 'class-name'
            }
        }
    }
}
</script>

import React from 'react';

import Chat from 'devextreme-react/chat';

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

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

errors

focusStateEnabled

height

hoverStateEnabled

items

message

onDisposing

onInitialized

onMessageEntered

onMessageSend

onOptionChanged

onTypingEnd

onTypingStart

reloadOnChange

rtlEnabled

DevExpress.config({
    rtlEnabled: true
});

showAvatar

showDayHeaders

showMessageTimestamp

showUserName

title

typingUsers

user

visible

width