Audio Dialogs
- 2 minutes to read
Audio dialogs include the Insert Audio and Change Audio dialogs that allow end users to insert audio content to the editor and change it, respectively.
A dialog can be invoked in the design view in the following ways.
- By clicking the Insert Audio menu toolbar or ribbon button (that is an instance of the ToolbarInsertAudioDialogButton or HEInsertAudioDialogRibbonCommand class, respectively).
- By double clicking an audio element in the editor.
- By clicking the Change Audio… context menu item.
- Programmatically, by passing the ASPxClientCommandConsts.INSERTAUDIO_DIALOG_COMMAND or ASPxClientCommandConsts.CHANGEAUDIO_DIALOG_COMMAND property value to the ASPxClientHtmlEditor.ExecuteCommand method.
Dialog Structure
An audio dialog contains three tabs listed below.
Tab caption | Tab visibility | Description |
---|---|---|
From your computer | HtmlEditorInsertMediaDialogSettings.ShowFileUploadSection | Allows end-users to upload their local files. |
From the gallery | HtmlEditorFileManagerSettingsBase.Enabled | Allows end-users to add to editor content audio files from the predefined gallery. You can customize the gallery settings using the HtmlEditorInsertAudioDialogSettings.SettingsAudioSelector and HtmlEditorInsertAudioDialogSettings.SettingsAudioUpload properties. |
From the web (URL) | HtmlEditorInsertMediaDialogSettings.ShowInsertFromWebSection | Allows end-users to upload files from the web. |
When the More options check box is selected, the dialog displays the settings section, which allows end-users to customize audio element settings (size, position, description and style settings such as margins, border and CSS class). You can hide the check box by setting the HtmlEditorInsertMediaDialogSettingsBase.ShowMoreOptionsButton property to false.
Dialog Customization
You can customize dialog settings programmatically by using the HtmlEditorDefaultDialogSettings.InsertAudioDialog property; or using the design-time ASPxHtmlEditor Designer.
Online Demo
Related Client API
ASPxHtmlEditor provides a comprehensive API, allowing you to operate with the opened dialog programmatically on the client side.