This is a migrated thread and some comments may be shown as answers.

RadEditor Client side validation

9 Answers 484 Views

General Discussions

This is a migrated thread and some comments may be shown as answers.

Shrikant Kale asked on 06 Jan 2010, 05:11 AM

Hi All,

I am facing problems with client side validation of RadEditor.
I want to put a check on length of the string entered in editor.

Following is the code, I have written:

    
            ========ASPX======== 
        
            <html xmlns="http://www.w3.org/1999/xhtml" > 
        
            <head runat="server"> 
        
                <title></title> 
        
                <telerik:RadScriptBlock runat="server" ID="RadScriptBlock1"> 
        
                <script type="text/javascript" language="javascript"> 
        
                function ValidateEditor() 
        
                { 

                    alert($find("<%=editor1.ClientID %>").get_text().length); 
        
                    alert($find("<%=editor1.ClientID %>").get_html().length); 
        
                    alert($find("<%=editor1.ClientID %>").get_html(true).length); 
        
                } 
        
                function ValidateEditor1(sender, args) 
        
                { 
        
                    alert("args.Value.length = "+args.Value.length); 
        
                } 
        
                </script> 
        
                </telerik:RadScriptBlock> 
        
            </head> 
        
            <body> 
        
                <form id="form1" runat="server"> 
        
                <div> 
        
                    <telerik:RadScriptManager ID="RadScriptManager1" runat="server"> 
        
                    </telerik:RadScriptManager> 
        
                    <asp:CustomValidator ID="val1" Display="None" runat="server" ClientValidationFunction="ValidateEditor" 
        
                        ValidationGroup="group1"></asp:CustomValidator> 
        
                    <asp:CustomValidator ID="CustomValidator1" Display="None" runat="server" ClientValidationFunction="ValidateEditor1" 
        
                        ValidationGroup="group1" ControlToValidate="editor1"></asp:CustomValidator> 
        
                    <telerik:RadEditor ID="editor1" runat="server" Width="400" Height="100" 
        
                        Skin="Vista" EditModes="Design"> 
        
                        <Tools> 
        
                            <telerik:EditorToolGroup> 
        
                                <telerik:EditorTool Name="Bold" /> 
        
                                <telerik:EditorTool Name="Italic" /> 
        
                                <telerik:EditorTool Name="Underline" /> 
        
                                <telerik:EditorTool Name="InsertOrderedList" /> 
        
                                <telerik:EditorTool Name="InsertUnorderedList" /> 
        
                                <telerik:EditorTool Name="Indent" /> 
        
                                <telerik:EditorTool Name="Outdent" /> 
        
                                <telerik:EditorTool Name="JustifyLeft" /> 
        
                                <telerik:EditorTool Name="JustifyCenter" /> 
        
                                <telerik:EditorTool Name="JustifyRight" /> 
        
                            </telerik:EditorToolGroup> 
        
                        </Tools> 
        
                    </telerik:RadEditor> 
        
                    <asp:Button Text="SAVE" ID="button16" OnClick="Save_Click" 
        
                        runat="server" ValidationGroup="group1" /> 
        
                </div> 
        
                </form> 
        
            </body> 
        
            ========CODE BEHIND======== 
        
                public partial class EditorValidation : System.Web.UI.Page 
        
                { 
        
                    protected void Page_Load(object sender, EventArgs e) 
        
                    { 
        
                    } 
        
                    protected void Save_Click(object sender, EventArgs e) 
        
                    { 
        
                        int len = editor1.Content.Length; 
        
                    } 
        
                }

To put check on length, I used function get_html() and get_text(). But length of string returned by these function is sometimes smaller than length of server side attribute "Content".
Then I found online demo(http://demos.telerik.com/aspnet-ajax/editor/examples/validators/defaultcs.aspx) which had implementation like function "ValidateEditor1". But that also returned smaller length.

I observed that this problem consistently occurs with strings spanning over multiple lines. You can try this by entering any multi-line string in the editor.

So I think I will be able to solve this problem if I find some api on client side, which returns string exactly equal to the one returned by server side attribute "Content". Can anyone provide more insight into this problem?

Regards
Shrikant

9 Answers, 1 is accepted

answered on 06 Jan 2010, 12:34 PM

Hi Shrikant,

I am aware of a similar problem which is due to the editor's content area indentation filter which adds a lot of spaces to nicely indent the content in HTML mode. Could you please disable this filter with the codebehind code below and see whether this will solve the problem on your side:

RadEditor1.DisableFilter(EditorFilters.IndentHTMLContent);

Please note also that in the Q3 2009 build of RadEditor for ASP.NET AJAX we introduced two new properties MaxTextLenght and MaxHTMLLength to limit content size. You can use the MaxTextLenght property in your scenario.

The MaxTextLength and MaxHtmlLength properties check the character length only when submitting the content. We decided to implement them in this means because if we check the content length on paste and / or on onkeydown then this will decrease performance and will slow down the typing / editing of large content. This is how these properties are implemented in our competitors' web editors as well.

Best regards,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 06 Jan 2010, 03:58 PM

Hi Shrikant,

Here is an example demonstrating how to override the displayMaxTextLengthErrorMessage function and display the error message in a DIV element:

<telerik:RadEditor MaxTextLength="10" runat="server" ID="RadEditor1"></telerik:RadEditor>

<div id="counter"></div>

<script type="text/javascript">

Telerik.Web.UI.RadEditor.prototype.displayMaxTextLengthErrorMessage = function()

{

var editor = $find("<%=RadEditor1.ClientID%>");

$get("counter").innerHTML = "You are not allowed to type more than " + editor.get_maxTextLength() + " symbols";

}

</script>

<asp:Button ID="btn_test" Text="Test" runat="server" />

When the MaxHtmlLength property is set then you should override the displayMaxHtmlLengthErrorMessage function.

All the best,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 07 Jan 2010, 06:18 AM

Hi Rumen,

I am facing client side validation issue again. Disabling filter solved my problem for some cases. But I still get this problem in some cases.

I am describing my problem again, functions get_html() and get_html(true) are returning me smaller string than the one returned by server side attribute "Content".
Because of this my client side validations pass but data gets truncated while storing in database.

So is there any way by which I can get string on client side, which will be exactly same as server side attribute "Content"?

Regards
Shrikant

answered on 07 Jan 2010, 10:01 AM

Hi Shrikant,

You can try to disable all content filters of RadEditor by setting ContentFilters="None" and see whether this will fix the problem.

If you still experience any issues, please open a support ticket and send a sample working project along with sample content that demonstrates the issue. I will debug the project and try to provide a solution.

Kind regards,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.

answered on 11 Aug 2010, 06:29 PM

Hi,

I have our company's client managing the HTML content using Microsoft EPM (SharePoint) Rich text Editor.

Some times the HTML is invalid and out of the reach of any telerik Editor filters to validate the same..

when we load this content in our Application using RAD editior to export to PDF.. I tried all the formate strippers (cant use CSS striping as we need the styles to be maintained in PDF) I m sure that somewhere the invalid HTML that hinders the Export.. say out of 100 reports only 6 report has this export problem due to invalid HTML tagging...

is there a way where we can do the HTML/XHTML validation of the Editor Content - Server side or Client side so that I can export the Editor Content to PDF?

Thanks

Sid

answered on 16 Aug 2010, 02:25 PM

Hello Siddharth,

The RadEditor's content filters could not guarantee the production of 100% valid XHTML content, because it is very easy to paste non well formed content in RadEditor. While the Telerik RadEditor can compensate and automatically convert many of non-valid XHTML tags and attribute, the responsibility for producing valid XHTML compliant content is partially on the side of the user. That is why, we strongly suggest the use of the integrated XHTML Validator dialog for the timely discovery and correction of non-compliant content.

You can find more detailed information in this help article: XHTML Compliance.

Kind regards,
Rumen
the Telerik team

Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items