This is a migrated thread and some comments may be shown as answers.
Enter data into Rad Editor after apply "Bold" style data not shown as dotted lines.
0 Answers 3 Views
This is a migrated thread and some comments may be shown as answers.
Monu
Top achievements
Rank 1
Monu asked on 28 Mar 2018, 12:29 PM
Hi Team,
Below sample code I am using, now when I run the application, I have entered some text and make it as "Bold" (select from toolbar) and click enter and write some more sentence, now, what ever I wrote those sentence I am seeing with dotted lines (see the attached image).
Note# "EditMode="Design"  please help me asap.
FYI, to replicate this issue use below sample code and, follow below steps.
when "EditMode="Design" first enter some sample text then make it bold that text -->click on enter-->enter some more text you will able to see dotted lines.
Goto "Preview" mode, you can able to see all the sentence which you entered in "Design" mode. 
If I remove "ContentAreaMode="Div" " property, it's working fine but I need this property. 
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<!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 runat="server">
    <title></title>
</head>
<script type="text/javascript">


    function RadEditorOnLoad(editor, args) {
        //debugger;
        var htmlArea = editor.get_textArea();
        var contentArea = editor.get_contentArea();

        var editorId = editor._element.id;
        if (htmlArea) {
            htmlArea.attachEvent('onchange', function () { MyCharacterCounter(editor, ''); });
            htmlArea.attachEvent('onkeyup', function () { MyCharacterCounter(editor, ''); });
            htmlArea.attachEvent('onkeypress', function () { MyCharacterCounter(editor, ''); });
        }
        if (contentArea) {
            contentArea.attachEvent('onchange', function () { MyCharacterCounter(editor, ''); });
            contentArea.attachEvent('onkeyup', function () { MyCharacterCounter(editor, ''); });
            contentArea.attachEvent('onkeypress', function () { MyCharacterCounter(editor, ''); });
        }
    }

    function MyCharacterCounter(editor, ExpLen) {

        var comments = editor._contentArea.innerText;

        var counterlabel = editor._element.parentElement.children[2];

        if (document.getElementById(ExpLen)) {
            var maxlength = document.getElementById(ExpLen).value;
        }
        else {
            var maxlength = document.getElementById('hdnExplanationLength').value;
        }

        if (comments.length == parseInt(maxlength)) {
            counterlabel.innerHTML = "0 Text Limit has been reached";
        }
        else if (comments.length > parseInt(maxlength)) {
            counterlabel.innerHTML = (parseInt(maxlength) - comments.length) + " Text Limit has been exceeded, Please reduce the text";
        }
        else {
            counterlabel.innerHTML = (parseInt(maxlength) - comments.length);
        }

        if (comments.length > parseInt(maxlength)) {
            counterlabel.style.color = 'red'
        }
        else {
            counterlabel.style.color = 'grey'
        }
    }    
</script>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
    </telerik:RadScriptManager>
    <div>
        <table width="100%">
            <tr width="100%">
                <td width="100%">
                    <asp:HiddenField ID="hdnExplanationLength" runat="server" Value="2000" />
                    <telerik:RadEditor ID="txt_GeneralExplanationAdd" BorderStyle="None" runat="server"
                        Width="50%" ToolsFile="ToolsFile.xml" Height="200px" Font-Names="Tahoma" Font-Size="11px"
                        Style="margin-bottom: 5px;" EnableResize="False"  ContentAreaMode="Div" StripFormattingOptions="MSWordRemoveAll,ConvertWordLists"
                        StripFormattingOnPaste="None" NewLineMode="Br" NewLineBr="true" OnClientLoad="RadEditorOnLoad">
                    </telerik:RadEditor>
                    <asp:Label ID="lbl_PrescriberExpTextCounter" runat="server" Text='2000' Style="color: Gray;
                        float: right; margin-bottom: 5px;"></asp:Label>
                </td>
            </tr>
        </table>

    </div>
    </form>
</body>
</html>
ToolsFile.XML
<root>
  <tools>
    <tool name="Bold" strip="FontBasicTools" shortcut="CTRL+B"/>
    <tool name="Italic" strip="FontBasicTools" shortcut="CTRL+I"/>
    <tool name="Underline" strip="FontBasicTools" shortcut="CTRL+U"/>
    <tool name="ForeColor"/>
    <tool name="BackColor"/>
  </tools>
  <tools>
    <tool name="InsertUnorderedList" strip="ListsAndIndention"/>
    <tool name="InsertOrderedList" strip="ListsAndIndention"/>
    <tool name="JustifyLeft" strip="Align"/>
    <tool name="JustifyCenter" strip="Align"/>
    <tool name="JustifyRight" strip="Align"/>
    <tool name="JustifyFull" strip="Align"/>
    </tools>
</root>

No answers yet. Maybe you can help?

Asked by
Monu
Top achievements
Rank 1
Share this question
or