Hi, Previously we have been using Infragistics 2006 Vol 3 version. Now we have purchased Infragistics 2001 Vol 1. I have updated our project to the latest version. I have a webhtml editor in the page, i have added a right-click option to the editor. I have the options "Cut", "Copy", "Paste" and "Paste as HTML". When we click on "Paste", it should paste without any extra tags. When we click on "Paste as HTML", it will paste the text with the existing formats. The problem that i face is, When i right-click on the control and click on paste, first it's ask a question "Do you want to allow this webpage to access your Clipboard?". I click on "Allow Access", and it paste the text. By default, after pasting the text the right-click event should get disappeared, but it doesn't happen.
Now i click on "Save", in the server side, it is saying there is no value. If after pasting, i just click on the editor, the menu then gets disappeared and then i click on "Save" button without typing any text. In the server-side, now i am able to see the text value.
But when i right-click and select "Paste as HTML", then the menu gets disappeared and on clicking on "Save" button, i am able to see the text value in server-side. I am puzzled by this behaviour. I have attached the image and also the code for it. Please tell me is there a problem with my code?
<script id="igClientScript" type="text/javascript"><!--var ctrl = false;var v = false;function HtmlEditorKeyDown(oEditor, keyCode, oEvent) { if(keyCode == 17) ctrl = true; if(keyCode == 86) v = true; if(ctrl == true && v == true) { var text; if(window.clipboardData.getData("Text")!= null && window.clipboardData.getData("Text")!= "") { text = window.clipboardData.getData("Text"); } PasteFromClipboard(); oEvent.cancel = true; return false; } }function UpdateEditor(){ var evnt = window.event; x = evnt.keyCode; if(x == 17) ctrl = false; if(x == 86) v = false; var edit = iged_getById("<%=WMS_txtBox.ClientID%>"); edit._update();}function CutToClipboard(){ CutTxt = document.selection.createRange(); CutTxt.execCommand("Cut"); document.getElementById("<%=WMS_txtBox.ClientID%>").focus(); } function WebHtmlEditor1_AfterAction(oEditor, actID, oEvent){ oEditor._update();}function CopyToClipboard(){ CopiedTxt = document.selection.createRange(); CopiedTxt.execCommand("Copy"); }function PasteFromClipboard(){ var edit = iged_getById("<%=WMS_txtBox.ClientID%>"); edit.focus(); if(window.clipboardData.getData("Text")!= null && window.clipboardData.getData("Text")!= "") insertAtCursor(edit, window.clipboardData.getData("Text"));} function insertAtCursor(myField, myValue) {//IE support if (document.selection) { myField.focus(); sel = document.selection.createRange(); sel.text = myValue; } //MOZILLA/NETSCAPE support else if (myField.selectionStart || myField.selectionStart == '0') { var startPos = myField.selectionStart; var endPos = myField.selectionEnd; myField.value = myField.value.substring(0, startPos) + myValue + myField.value.substring(endPos, myField.value.length); } else { myField.value += myValue; }}function EnableSpellCheck() { var keyCode = event.keyCode; if ((keyCode == 32 || keyCode == 31) && document.getElementById("<%=btnSpellCheck.ClientID%>").value == "") document.getElementById("<%=btnSpellCheck.ClientID%>").disabled=true; else document.getElementById("<%=btnSpellCheck.ClientID%>").disabled=false; return true; } function callSpellCheck() { var editor = ig_getWebControlById("<%=WebSpellChecker1.ClientID%>"); if (editor == null) { alert('Spell Checker Component was not found!'); return; } var edit = iged_getById("<%=WMS_txtBox.ClientID%>").ID; editor.checkTextComponent(edit); } function wbtnSoundRecorder_Click(id){ IsDT = "<%=Session["IsDT"]%>"; if(IsDT == "True") { if(document.getElementById("DeliveryControl1_hdnSoundRecorder") != null) { document.getElementById("DeliveryControl1_hdnSoundRecorder").value = iged_getById("<%=WMS_txtBox.ClientID%>").ID; } if(document.getElementById("MFODeliveryControl1_hdnSoundRecorder") != null) { document.getElementById("MFODeliveryControl1_hdnSoundRecorder").value = iged_getById("<%=WMS_txtBox.ClientID%>").ID; } var url ="http://SoundRecorder"; window.open(url,'PopUpWindow','',''); } }function replaceAll(text, strA, strB) { while ( text.indexOf(strA) != -1) { text = text.replace(strA,strB); } return text;}function getWMS_txtBoxText(){ var editor = iged_getById('<%= WMS_txtBox.ClientID %>'); if (!editor) return ""; if (editor._ie) return editor._elem.innerText; if (editor._body().innerText) return editor._body().innerText; return editor._body().textContent;}function setWMS_txtBoxText(text){ var edit = iged_getById("<%=WMS_txtBox.ClientID%>"); edit.setText(text); }function setWMS_txtBoxFocus(){ document.getElementById("<%=WMS_txtBox.ClientID%>").focus();}function wbtnScreenRecorder_Click(){ //Add code to handle your event here. IsDT = "<%=Session["IsDT"]%>"; if(IsDT == "True") { var url ="ScreenRecorder"; window.open(url,'PopUpWindow','',''); }}function btnTemplate_Click(oButton, oEvent){ igmenu_showMenu('UltraWebMenuTemplate', event,(getElementPosition('btnTemplate').left)-120,(getElementPosition('btnTemplate').top)+10); oEvent.cancel=true; oEvent.cancelPostBack=true; this.CancelPostBack=true;}function UltraWebMenuTemplate_ItemClick(menuId, itemId){ var item = igmenu_getItemById(itemId); alert(item.getTag()); if(item != null && item != 'undefined') { var text = item.getTag(); if(text.indexOf(':') > 0) { text = text.substring(text.indexOf(':')+2); } var menu = igmenu_getMenuById(menuId); if(text != "Exit Menu") { insertAtCursor(document.getElementById("<%=WMS_txtBox.ClientID%>"), text); menu.CancelPostBack = true; this.CancelPostBack=true; } else { menu.CancelPostBack = true; this.CancelPostBack=true; } }}function getElementPosition(elemID){ var offsetTrail = document.getElementById("<%=btnTemplate.ClientID%>"); var offsetLeft = 0; var offsetTop = 0; while (offsetTrail) { offsetLeft += offsetTrail.offsetLeft; offsetTop += offsetTrail.offsetTop; offsetTrail = offsetTrail.offsetParent; } return { left: offsetLeft, top: offsetTop }; }function WebSpellChecker1_BeforeSpellCheckBegins(oWebSpellChecker, oEvent, uncheckedText){ }function getDelDesc(name){ var editor = iged_getById(name); if (!editor) return ""; if (editor._ie) return editor._elem.innerText; if (editor._body().innerText) return editor._body().innerText; return editor._body().textContent;}// --></script><table style="height:98%;width:100%;border-bottom:solid 1px #759DB9;border-top:solid 1px #759DB9;border-left:solid 1px #759DB9;border-right:solid 1px #759DB9" cellpadding="0" cellspacing="0"> <tr id="trButton" runat="server" visible="false" ><td width="100%" height="25px" align="left" id="tdTextBoxCtrl" runat="server" ><table style="height:25px; width:100%;" cellpadding="0" cellspacing="0" align="left"> <tr align="left" ><td><BUTTON id="btnCut" tabIndex="1" type="button" onClick="CutToClipboard()" runat="server" style="border:0px;cursor:hand;background-color:Transparent;" title="Cut"><img runat="server" id="imgCut"/></BUTTON> </td><td style="height:20px;padding-left:8px"><BUTTON id="btnCopy" tabIndex="1" type="button" onClick="CopyToClipboard()" runat="server" style="border:0px;cursor:hand;background-color:Transparent;" title="Copy"><img runat="server" id="imgCopy"/></BUTTON></td><td style="height:20px;padding-left:8px"><BUTTON id="btnPaste" tabIndex="1" type="button" onClick="PasteFromClipboard()" runat="server" style="border:0px;cursor:hand;background-color:Transparent;" title="Paste"><img runat="server" id="imgPaste"/></BUTTON></td><td style="height:20px;padding-left:8px;padding-right:8px;background-color:Transparent;" align="right" runat="server" id="tdSep3"><asp:Panel runat="server" ID="Panel2" Width="1px"></asp:Panel></td><td width="16px" align="right" ><igtxt:WebImageButton ID="wbtnScreenRecorder" SkinID="CCEWebPrev" runat="server" Text="" UseBrowserDefaults="False" Height="16px" Width="16px" ToolTip ="Screen Recorder" > <ClientSideEvents Click="wbtnScreenRecorder_Click" /> </igtxt:WebImageButton></td><td style="height:20px;padding-left:8px;padding-right:8px;background-color:Transparent;" align="right" runat="server" id="tdSep2"><asp:Panel runat="server" ID="Panel1" Width="1px"></asp:Panel></td><td align="right"> <BUTTON id="btnSpellCheck" tabIndex="1" type="button" runat="server" style="border:0px;cursor:hand;background-color:Transparent;" title="Check Spelling"><img runat="server" id="imgBtn"/></BUTTON></td><td style="height:20px;padding-left:8px;padding-right:8px" align="right" runat="server" id="tdSep1"><asp:Panel runat="server" ID="pnlsep" Width="1px"></asp:Panel></td> <td width="16px" align="right" style="padding-right:8px"> <igtxt:WebImageButton ID="wbtnSoundRecorder" SkinID="CCEWebNext" runat="server" Text="" UseBrowserDefaults="False" Height="16px" Width="16px" ToolTip ="Sound Recorder" > <ClientSideEvents Click="wbtnSoundRecorder_Click" /> </igtxt:WebImageButton></td><td><igtxt:WebImageButton ID="btnTemplate" SkinID="CCETemplateBtn" runat="server" Text="Insert from template" UseBrowserDefaults="False" Height="16px" ToolTip ="Click here to select templates" Visible="false" > <ClientSideEvents Click="btnTemplate_Click" /> </igtxt:WebImageButton> </td><td width="100%" > </td></tr></table></td></tr><tr style="height:98%;"><td style="width:100%;height:98%;word-break:normal;word-wrap: break-word"> <ighedit:WebHtmlEditor ID="WMS_txtBox" Width="100%" EnableViewState="true" Focus="false" Height="100%" SkinID = "CCEWebHtmlEditor" runat="server" TabStripDisplay="False" SpellCheckerID="WebSpellChecker1" UseLineBreak="true" 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="Ω,Σ,Δ,Φ,Γ,Ψ,Π,Θ,Ξ,Λ,ξ,μ,η,φ,ω,ε,θ,δ,ζ,ψ,β,π,σ,ß,þ,Þ,ƒ,Ж,Ш,Ю,Я,ж,ф,ш,ю,я,お,あ,絵,Æ,Å,Ç,Ð,Ñ,Ö,æ,å,ã,ç,ð,ë,ñ,¢,£,¤,¥,№,™,©,®,—,@,•,¡,,←,↑,→,↓,↔,↕,↖,↗,↘,↙,,¦,§,¨,ª,¬,¯,¶,°,±,«,»,·,¸,º,¹,²,³,¼,½,¾,¿,×,÷" StartupMode="Design"> <Toolbar Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" CssClass="HideToolbar" BackgroundImage="" Height="25"> <ighedit:ToolbarDropDown Type="FontName" Height="18" Width="30" UseAdvancedDisplay="true" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/dropdown.gif" MouseDownImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/dropdown_down.gif" MouseOverImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/dropdown_over.gif" > </ighedit:ToolbarDropDown> <ighedit:ToolbarDropDown Type="FontSize" Height="18" Width="30" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/dropdown.gif" MouseDownImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/dropdown_down.gif" MouseOverImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/dropdown_over.gif"> </ighedit:ToolbarDropDown> <ighedit:ToolbarImage runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Separator" Key="Img5" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Separator.gif" /> <ighedit:ToolbarButton runat="server" Font-Bold="False" CssClass="toolbar" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Bold" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Bold.gif" /> <ighedit:ToolbarButton runat="server" Font-Bold="False" CssClass="toolbar" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Italic" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Italic.gif" /> <ighedit:ToolbarButton runat="server" Font-Bold="False" CssClass="toolbar" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Underline" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Underline.gif" /> <ighedit:ToolbarImage runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Separator" Key="Img2" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Separator.gif" /> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Cut" CssClass="toolbar" onClick="CutToClipboard()" ImageName="./App_Themes/CCEPLXGNewStyles/Images/Cut.gif" /> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Copy" CssClass="toolbar" onClick="CopyToClipboard()" ImageName="./App_Themes/CCEPLXGNewStyles/Images/Copy.gif"/> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Custom" ToolTip="Paste" Key="PastePlain" onclick="PasteFromClipboard()" CssClass="toolbar" ImageName="./App_Themes/CCEPLXGNewStyles/Images/Paste.gif"/> <ighedit:ToolbarImage runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Separator" Key="Img1" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Separator.gif" /> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="SpellCheck" CssClass="toolbar" ImageName="./App_Themes/CCEPLXGNewStyles/Images/SpellCheck.gif"> </ighedit:ToolbarButton> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Key="Sound" Font-Strikeout="False" Font-Underline="False" Type="Custom" ToolTip="Sound Recorder" CssClass="toolbar" onClick="wbtnSoundRecorder_Click(id)" ImageName="./App_Themes/CCEPLXGNewStyles/Images/SoundRec.gif"> </ighedit:ToolbarButton> <ighedit:ToolbarImage runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Separator" Key="Img3" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Separator.gif" /> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="JustifyLeft" CssClass="toolbar" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/JustifyLeft.gif" /> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="JustifyCenter" CssClass="toolbar" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/JustifyCenter.gif"/> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="JustifyRight" CssClass="toolbar" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/JustifyRight.gif"/> <ighedit:ToolbarButton runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="JustifyFull" CssClass="toolbar" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/JustifyFull.gif"/> <ighedit:ToolbarImage runat="server" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" Type="Separator" Key="Img4" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Separator.gif"/> <ighedit:ToolbarDialogButton Type="FontColor" CssClass="toolbar" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/FontColor.gif"> <Dialog Strings=""></Dialog> </ighedit:ToolbarDialogButton> <ighedit:ToolbarDialogButton Type="FontHighlight" CssClass="toolbar1" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/FontHighlight.gif"> <Dialog Strings=""></Dialog> </ighedit:ToolbarDialogButton> </Toolbar> <ClientSideEvents KeyDown="HtmlEditorKeyDown" AfterAction="WebHtmlEditor1_AfterAction"/> <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" /> <RightClickMenu > <ighedit:HtmlBoxMenuItem runat="server" Act="Cut" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Cut.gif"> </ighedit:HtmlBoxMenuItem> <ighedit:HtmlBoxMenuItem runat="server" Act="Copy" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Copy.gif"> </ighedit:HtmlBoxMenuItem> <ighedit:HtmlBoxMenuItem runat="server" Text="Paste" onmouseover='this.style.backgroundColor="#C1D2EE"' onmouseout='this.style.backgroundColor="#FFFFFF"' onclick="PasteFromClipboard();" CssClass="paste" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Paste.gif"> </ighedit:HtmlBoxMenuItem> <ighedit:HtmlBoxMenuItem runat="server" Act="Paste" Text="Paste As Html" Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" ImageName="./App_Themes/CCEPLXGNewStyles/Images/HtmlEditor1/Paste.gif"> </ighedit:HtmlBoxMenuItem> </RightClickMenu> <TextWindow Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" BorderWidth="0" /> <DownlevelLabel Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> <TabStrip Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False" Font-Underline="False" /> </ighedit:WebHtmlEditor> </td></tr></table><div><ig_spell:WebSpellChecker ID="WebSpellChecker1" runat="server" EnableViewState="False"> <DialogOptions ShowNoErrorsMessage="True" /> <ClientEvents BeforeSpellCheckBegins="WebSpellChecker1_BeforeSpellCheckBegins" /> </ig_spell:WebSpellChecker></div>
Thanks and Regards,
S.Rajagopalan.
Hello Rajagopalan,
I created a sample with your code. I am pasting as HTML the following text“deerrreresas”
and when I press on the save button I am able to get the proper text with proper formatting and to display it in the label I added under the WHEditor. The context menu is disappearing after the paste is clicked. Can you please describe again the steps to reproduce and what do you mean by “event should get disappeared”. Also please let me know under which browser you are facing the issue. Please also do not paste your code but attach it in *.zip files instead otherwise the forum thread is becoming hard to read.
Hello Rajagolapan,Please let me know if you have any further questions regarding this issue.