'Declaration Public ReadOnly Property Dialog As HtmlBoxDialog
public HtmlBoxDialog Dialog {get;}
This property returns the HtmlBoxDialog representing the dialog that appears when the ToolbarDialogButton is clicked. For all predefined ToolbarDialogButtons (all ToolbarDialogButtonType values except for ToolbarDialogButtonType.Custom) this property will be properly initialized. For ToolbarDialogButtonType.Custom, create the dialog content by setting the HtmlBoxDialog.Text property.
'-------------------- ' Note: custom buttons with all their properties can be created within aspx. ' That would reduce size of hidden viewstate field and improve persistance of properties. ' To generate toolbar items at visual design,- the editor for Toolbar property can be used. Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load If (Me.IsPostBack) Then Return End If '------------------- ' Add a button with custom dialog which is defined in aspx. Dim myDialogButton As ToolbarDialogButton = New ToolbarDialogButton() myDialogButton.Key = "MyDialogButtonKey" myDialogButton.Type = ToolbarDialogButtonType.Custom Dim dialog As HtmlBoxDialog = myDialogButton.Dialog dialog.Caption = "This is my dialog" '------------------- ' Note: the html element with id "MyDialogID" should exist within asxp. ' Note: to connect dialog-content with its container, application ' should process ClientSideEvents.Initialize. dialog.DialogContentID = "MyDialogID" dialog.Key = "MyDialogKey" dialog.TitlebarBackColor = System.Drawing.Color.Orange dialog.TitlebarFontSize = FontUnit.Point(12) Me.WebHtmlEditor1.Toolbar.Items.Add(myDialogButton) '------------------- ' Add a button with custom dialog which is defined by the Dialog.Text property. Dim myDialogButton2 As ToolbarDialogButton = New ToolbarDialogButton() myDialogButton2.Key = "MyDialogButton2Key" myDialogButton2.Type = ToolbarDialogButtonType.Custom Dim dialog2 As HtmlBoxDialog = myDialogButton2.Dialog dialog2.Caption = "My Dialog 2" dialog2.Text = "Enter value:<input id='myDialog2Input' value='value from Dialog2' /><p></p><input type='button' onclick='myDialog2Click()' value='Click to insert text' /><script type='text/javascript'>function myDialog2Click(){iged_getById('WebHtmlEditor1').insertAtCaret(document.getElementById('myDialog2Input').value);}</script>" dialog2.Key = "MyDialog2Key" Me.WebHtmlEditor1.Toolbar.Items.Add(myDialogButton2) End Sub To connect DialogContentID with content of dialog (html elements in aspx), an application should process <ClientSideEvents Initialize="WebHtmlEditor1_Initialize" /> event. Codes below should appear within the HEAD section of HTML. <script type="text/javascript"><!-- //---------------- // That function is called when WebHtmlEditor1 was initialized. function WebHtmlEditor1_Initialize(oEditor) { initializeMyDialog(); } //---------------- // That function is called by WebHtmlEditor1_Initialize in order to // initialize content of custom dialog, which is defined explicitly within aspx var myDialogWasConnected = false; function initializeMyDialog() { if(myDialogWasConnected) return; myDialogWasConnected = true; //---------------- // Find reference to html-element container for MyDialogID. // That value was set to ToolbarDialogButton.Dialog.DialogContentID var dialog = document.getElementById("MyDialogID"); if(!dialog) return; //---------------- // Find reference to html-element content for MyDialog. // The html element with that id was created within aspx. var content = document.getElementById("MyDialogContentID"); //---------------- // Remove MyDialogContentID from its temporary container (body of asxp-page) // and insert it into MyDialogID container, which is used by WebHtmlEditor. content.parentNode.removeChild(content); dialog.appendChild(content); //---------------- // Undo initial hidden state. content.style.display = ""; content.style.visibility = "visible"; } //---------------- // That function is called by a button located in custom dialog MyDialogContentID. // Build some object (here SPAN) and insert it into WebHtmlEditor at current selection. function myDialogButtonClick2(message) { var object = document.createElement("SPAN"); var style = object.style; style.border = "2px solid red"; style.background = "cyan"; style.fontFamily = "verdana"; style.fontStyle = "italic"; style.fontSize = "10pt"; style.padding = "5px"; object.innerHTML = "This is SPAN with message '" + message + "' from MyDialog"; //var oEditor = iged_getById("WebHtmlEditor1"); //---------------- // Close drop-down (dialog). iged_closePop(); //---------------- // Insert object (html element) into WebHtmlEditor at caret location. if(typeof iged_insNodeAtSel == "function")//Mozilla iged_insNodeAtSel(object); else//IE iged_insText(object.outerHTML); } //---------------- // That function is called by a button located in custom dialog MyDialogContentID. // Build some text and insert it into WebHtmlEditor at current selection. function myDialogButtonClick1(message) { var field = document.getElementById("myDialogEditField"); var text = field ? field.value : "Error: Can not find myDialogEditField."; text = "Message from dialog '" + message + "', where value of field='" + text + "'"; //var oEditor = iged_getById("WebHtmlEditor1"); //---------------- // Close drop-down (dialog). iged_closePop(); //---------------- // Insert text into WebHtmlEditor at caret location. iged_insText(text); } // --> </script>
//-------------------- // Note: custom buttons with all their properties can be created within aspx. // That would reduce size of hidden viewstate field and improve persistance of properties. // To generate toolbar items at visual design,- the editor for Toolbar property can be used. protected void Page_Load(object sender, EventArgs e) { if(this.IsPostBack) return; //------------------- // Add a button with custom dialog which is defined in aspx ToolbarDialogButton myDialogButton = new ToolbarDialogButton(); myDialogButton.Key = "MyDialogButtonKey"; myDialogButton.Type = ToolbarDialogButtonType.Custom; HtmlBoxDialog dialog = myDialogButton.Dialog; dialog.Caption = "This is my dialog"; //------------------- // Note: the html element with id "MyDialogID" should exist within asxp // Note: to connect dialog-content with its container, application // should process ClientSideEvents.Initialize. dialog.DialogContentID = "MyDialogID"; dialog.Key = "MyDialogKey"; dialog.TitlebarBackColor = System.Drawing.Color.Orange; dialog.TitlebarFontSize = FontUnit.Point(12); this.WebHtmlEditor1.Toolbar.Items.Add(myDialogButton); //------------------- // Add a button with custom dialog which is defined by the Dialog.Text property. ToolbarDialogButton myDialogButton2 = new ToolbarDialogButton(); myDialogButton2.Key = "MyDialogButton2Key"; myDialogButton2.Type = ToolbarDialogButtonType.Custom; HtmlBoxDialog dialog2 = myDialogButton2.Dialog; dialog2.Caption = "My Dialog 2"; dialog2.Text = "Enter value:<input id='myDialog2Input' value='value from Dialog2' /><p></p><input type='button' onclick='myDialog2Click()' value='Click to insert text' /><script type='text/javascript'>function myDialog2Click(){iged_getById('WebHtmlEditor1').insertAtCaret(document.getElementById('myDialog2Input').value);}</script>"; dialog2.Key = "MyDialog2Key"; this.WebHtmlEditor1.Toolbar.Items.Add(myDialogButton2); } To connect DialogContentID with content of dialog (html elements in aspx), an application should process <ClientSideEvents Initialize="WebHtmlEditor1_Initialize" /> event. Codes below should appear within the HEAD section of HTML. <script type="text/javascript"><!-- //---------------- // That function is called when WebHtmlEditor1 was initialized. function WebHtmlEditor1_Initialize(oEditor) { initializeMyDialog(); } //---------------- // That function is called by WebHtmlEditor1_Initialize in order to // initialize content of custom dialog, which is defined explicitly within aspx var myDialogWasConnected = false; function initializeMyDialog() { if(myDialogWasConnected) return; myDialogWasConnected = true; //---------------- // Find reference to html-element container for MyDialogID. // That value was set to ToolbarDialogButton.Dialog.DialogContentID var dialog = document.getElementById("MyDialogID"); if(!dialog) return; //---------------- // Find reference to html-element content for MyDialog. // The html element with that id was created within aspx. var content = document.getElementById("MyDialogContentID"); //---------------- // Remove MyDialogContentID from its temporary container (body of asxp-page) // and insert it into MyDialogID container, which is used by WebHtmlEditor. content.parentNode.removeChild(content); dialog.appendChild(content); //---------------- // Undo initial hidden state. content.style.display = ""; content.style.visibility = "visible"; } //---------------- // That function is called by a button located in custom dialog MyDialogContentID. // Build some object (here SPAN) and insert it into WebHtmlEditor at current selection. function myDialogButtonClick2(message) { var object = document.createElement("SPAN"); var style = object.style; style.border = "2px solid red"; style.background = "cyan"; style.fontFamily = "verdana"; style.fontStyle = "italic"; style.fontSize = "10pt"; style.padding = "5px"; object.innerHTML = "This is SPAN with message '" + message + "' from MyDialog"; //var oEditor = iged_getById("WebHtmlEditor1"); //---------------- // Close drop-down (dialog). iged_closePop(); //---------------- // Insert object (html element) into WebHtmlEditor at caret location. if(typeof iged_insNodeAtSel == "function")//Mozilla iged_insNodeAtSel(object); else//IE iged_insText(object.outerHTML); } //---------------- // That function is called by a button located in custom dialog MyDialogContentID. // Build some text and insert it into WebHtmlEditor at current selection. function myDialogButtonClick1(message) { var field = document.getElementById("myDialogEditField"); var text = field ? field.value : "Error: Can not find myDialogEditField."; text = "Message from dialog '" + message + "', where value of field='" + text + "'"; //var oEditor = iged_getById("WebHtmlEditor1"); //---------------- // Close drop-down (dialog). iged_closePop(); //---------------- // Insert text into WebHtmlEditor at caret location. iged_insText(text); } // --> </script>
Target Platforms: Windows 10, Windows 8.1, Windows 8, Windows 7, Windows Vista SP1 or later, Windows XP SP3, Windows Server 2008 (Server Core not supported), Windows Server 2008 R2 (Server Core supported with SP1 or later), Windows Server 2003 SP2