1. Created a custom toolbar dialog button with dialogContentID (let's say div1) pointing to a div on the page.
2. When the page loads, clicking on the button shows the content of div1. works fine. great!
3. Clicked on the editor again, dialog disappears (or could be any other action).
4. Clicked on the custom toolbar dialog button again.This time the Dialog Text appears (Type=InternalWindow). Should it display the div1 contents consistently?
5. Repeat item 3, click on the toolbar dialog button again, from here on it works consistently.
Ohh and another thing, if the div is located above the definition of the webHTMLEditor, it also behaves inconsistently.
Furthermore if the same dialog is being used by a custom toolbar button and also an html menuitem then same problem plus more inconsistency (not only on the second click)
Please look into this and let me know if I'm just missing something. Version is 7.3
Attaching content of my test aspx page, (nothing on the *.cs code behind/file just an Page_Load). Also removed other toolbars for brevity.
<%@ Page AutoEventWireup="true" CodeFile="Default2.aspx.cs" Inherits="Default2" Language="C#" %><%@ Register Assembly="Infragistics2.WebUI.WebHtmlEditor.v7.3, Version=7.3.20073.38, Culture=neutral, PublicKeyToken=7dd5c3163f2cd0cb" Namespace="Infragistics.WebUI.WebHtmlEditor" TagPrefix="ighedit" %><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head id="Head1" runat="server"> <title>Untitled Page</title></head><body> <form id="form1" runat="server"> <div> <div id="div1" style="display: none; background-color: gray; padding: 5px;">Custom Dialog Content</div> <ighedit:WebHtmlEditor ID="WebHtmlEditor1" runat="server" FontFormattingList="Heading 1=<h1>&Heading 2=<h2>&Heading 3=<h3>&Heading 4=<h4>&Heading 5=<h5>&Normal=<p>" FontNameList="Arial,Verdana,Tahoma,Courier New,Georgia" FontSizeList="1,2,3,4,5,6,7" FontStyleList="Blue Underline=color:blue;text-decoration:underline;&Red Bold=color:red;font-weight:bold;&ALL CAPS=text-transform:uppercase;&all lowercase=text-transform:lowercase;&Reset=" SpecialCharacterList="Ω,Σ,Δ,Φ,Γ,Ψ,Π,Θ,Ξ,Λ,ξ,μ,η,φ,ω,ε,θ,δ,ζ,ψ,β,π,σ,ß,þ,Þ,ƒ,Ж,Ш,Ю,Я,ж,ф,ш,ю,я,お,あ,絵,Æ,Å,Ç,Ð,Ñ,Ö,æ,å,ã,ç,ð,ë,ñ,¢,£,¤,¥,№,™,©,®,—,@,•,¡,,←,↑,→,↓,↔,↕,↖,↗,↘,↙,,¦,§,¨,ª,¬,¯,¶,°,±,«,»,·,¸,º,¹,²,³,¼,½,¾,¿,×,÷"> <DownlevelLabel Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> <DropDownStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> <ProgressBar Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> <DownlevelTextArea Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> <TextWindow Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> <Toolbar Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False"> <ighedit:ToolbarDropDown runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="FontStyle"> </ighedit:ToolbarDropDown> <ighedit:ToolbarDropDown runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Insert"> <Items> <ighedit:ToolbarDropDownItem runat="server" Act="Greeting" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> <ighedit:ToolbarDropDownItem runat="server" Act="Signature" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> </Items> </ighedit:ToolbarDropDown> <ighedit:ToolbarDialogButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Key="CustomToolbarButton" Type="Custom"> <Dialog DialogContentID="div1" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" InternalDialogType="Text" Key="CustomDialog" Text="Custom Dialog Text" Type="InternalWindow" /> </ighedit:ToolbarDialogButton> </Toolbar> <TabStrip Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> </ighedit:WebHtmlEditor> </div> </form></body></html>
Hi Ryan,
If type of dialog is text and Text is set, then WebHtmlEditor creates drop-down element automatically. However, when you set DialogContentID, then your custom html element should be used. So, if you set both properties, then WebHtmlEditor on client has 2 conflicting references for drop-down element. I guess WebHtmlEditor better raise run-time exception if both properties are set.
To fix, I suggest you to remove one of them and keep only Text or only DialogContentID.
Tried your suggestion but the issue still occurs. Only this time when the toolbar dialog button is clicked the second time then no text is display (just what seems to be a cursor below the button - but no dialog).
The relevant toolbar definition now reads:
<ighedit:ToolbarDialogButton runat="server" Key="CustomToolbarButton" Type="Custom"> <Dialog Caption="Segments" DialogContentID="div1" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Key="CustomDialog" Type="InternalWindow" /> </ighedit:ToolbarDialogButton>
Furthermore, I observed that this issue doesn't happen when Dialog.Type="InternalWindowWithTitlebar". I think we're close to resolving this but you guys know better than I do so hope you could verify and recommend a fix or a good workaround
Thanks and hope to hear more from you.
I missed that to test and by myself forgot how to create custom dialog. Sorry for that. There used to be a sample in installation, but I can not find it in latest NetAdvantage.
The rules related to custom dialog:
1. Write into aspx content of custom dialog and assign id to it like div1. Set display:none, visibility:hidden to it. Note: all that can be created later in step #4 below.2. Process ClientSideEvents.Initialize and within that handler do following:3. Find element with DialogContentID. Let say elemDialog4. Find element with content (div1) or create it dynamically. Let say elemContent.5. Remove elemContent from its parent, append it to elemDialog and remove display:hidden and visibility:hidden.
Below are codes from old sample, where MyDialogID is property of DialogContentID set on server, and MyDialogContentID is id of your content (it was div1).
// That function is called by WebHtmlEditor1_Initialize in order to
// initialize content of custom dialog, which is defined explicitly within aspx
var myDialogWasCreated = false;
{
return;
// Find reference to html-element container for MyDialogID.
// That value was set to ToolbarDialogButton.Dialog.DialogContentID
if(!dialog)
// Find reference to html-element content for MyDialog.
// The html element with that id was created within aspx.
// 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.
}
...
Dialog Content</div>
<Dialog DialogContentID="MyDialogID" InternalDialogType="Text" Key="CustomDialog" Type="InternalWindow" />
Thank you. That fixed it.
Had a few problems when a table is inside my MyDialogContent (text in the table remains even after leaving the dialog and clicking on some other parts of the editor/page) but used UL and LI instead but seems working fine now. Likely something with display and visibility attribute. The zoom dialog but can't seem to duplicate and opted for UL than digging deeper.
Thanks a lot Viktor