Editing content issues

1 posts, 0 answers
  1. Bader
    Bader avatar
    215 posts
    Member since:
    Aug 2008

    Posted 12 Jan 2012 Link to this post

    Hi,

    I have some questions based on the below sample usercontrol code which contains a RadEditor control:

    1) By trying to change the writing direction (RTL TO LTR or vise versa), Only by selecting the required paragraph and click on the required direction, the paragraph changes its direction. I need to enable the user to click the required direction and the cursor must be displayed in the required place, for example, In case there is no content on the RadEditor or the user clicked Enter to begin a new paragraph, if the user click RTL button, then the cursor must be displayed in the right (even if there is no content yet).

    2) The same issue as 1, I face with the bullet list. I need to clcik the bullet list button and the first bullet must be displayed, even if there is no content (In the current case, I need to type at least one letter and put the cursor in the begining of the row and to click the bullet list button).

    3) By caaling the user control within a FormView (Or any other control that needs DataSource), and trying to databind the EditorContent property as below, then, the content doesn't displayed, why? and how can I databind the radeditor control in my case?

    My user control:
    ascx:

    <%@ Control Language="C#" AutoEventWireup="true" CodeFile="DefaultUserControl.ascx.cs" Inherits="Tmonavot.General_App_Controls_RadEditor_DefaultUserControl" %>
    <link href="~/General/App/Controls/RadEditor/Style/Editor_RTL.css" rel="stylesheet" type="text/css" runat="server" id="EditorRtl" />
     
    <style type="text/css">
        .reTool .Right-to-Left
        {
            background-image: url('<%= RTLIconUrl %>');
        }
         
        .reTool .Left-to-Right
        {
            background-image: url('<%= LTRIconUrl %>');
        }
    </style>
     
    <asp:Panel ID="ContentPanel" runat="server" Direction="LeftToRight" HorizontalAlign="Left" Width="100%">
        <telerik:RadEditor runat="server" ID="CntntRadEditor" Skin="Default" Height="400px" Width="680px" style="z-index:1001;">
            
        </telerik:RadEditor>
    </asp:Panel>
     
    <telerik:RadScriptBlock ID="dd" runat="server">
        <script type="text/javascript">
            Telerik.Web.UI.Editor.CommandList["Right-to-Left"] = function (commandName, editor, args) {
                var oElem = editor.getSelectedElement();
                if (oElem && oElem.tagName == "P") {
                    oElem.setAttribute("dir", "rtl");
                    oElem.style.textAlign = "right";
                }
     
                else if (editor.getSelectionHtml())//There is some selection   
                {
                    var toPaste = "<p dir='rtl' style='text-align: right'>" + editor.getSelectionHtml() + "</p>";
                    editor.pasteHtml(toPaste);
                }
            }
     
            Telerik.Web.UI.Editor.CommandList["Left-to-Right"] = function (commandName, editor, args) {
                var oElem = editor.getSelectedElement();
                if (oElem && oElem.tagName == "P") {
                    oElem.setAttribute("dir", "ltr");
                    oElem.style.textAlign = "left";
                }
     
                else if (editor.getSelectionHtml())//There is some selection   
                {
                    var toPaste = "<p dir='ltr' style='text-align: left'>" + editor.getSelectionHtml() + "</p>";
                    editor.pasteHtml(toPaste);
                }
            }
     
             
        </script>  
    </telerik:RadScriptBlock>

    usercontrol c#:

    using System;
    using Telerik.Web.UI;
    using System.Web.UI.WebControls;
     
    namespace Tmonavot
    {
        public partial class General_App_Controls_RadEditor_DefaultUserControl : System.Web.UI.UserControl
        {
            public string RTLIconUrl = System.Web.VirtualPathUtility.ToAbsolute("~/General/App/Controls/RadEditor/CustomTools/Direction/RTL.png");
            public string LTRIconUrl = System.Web.VirtualPathUtility.ToAbsolute("~/General/App/Controls/RadEditor/CustomTools/Direction/LTR.png");
             
            protected void Page_Load(object sender, EventArgs e)
            {
                //Set the style for the PContentRadEditor content
                if (!IsPostBack)
                {
                    CntntRadEditor.DialogsCssFile = "~/General/App/Controls/RadEditor/Style/RadEditor_Dialogs_RTL.css";
                    CntntRadEditor.ContentAreaCssFile = "~/General/App/Controls/RadEditor/Style/EditorContentArea_RTL.css";
     
                    //Set the RadEditor content and tabindex
                    CntntRadEditor.Content = this.EditorContent;
                }
     
                //(FileUrlFileSelectorUserControl1.FindControl("FolderNameLabel") as Label).Text = "ContactUs";// (FileUrlFileSelectorUserControl1.FindControl("FileUrlRadTextBox") as RadTextBox).Text.ToString().Replace("~/Pages/", "");
                if (Resources.MngResource.ContentFloat.ToString().Equals("left"))
                {
                    switchToLTR();
                }
                else
                {
                    switchToRTL();
                }
            }
     
            private void switchToLTR()
            {
                ContentPanel.Direction = ContentDirection.LeftToRight;
                CntntRadEditor.DialogsCssFile = "";
                CntntRadEditor.ContentAreaCssFile = "";
                CntntRadEditor.CssFiles.Add(new EditorCssFile("~/General/App/Controls/RadEditor/Style/EditorContentArea_LTR.css"));
                EditorRtl.Attributes["Href"] = string.Empty;
            }
     
            private void switchToRTL()
            {
                ContentPanel.Direction = ContentDirection.RightToLeft;
                CntntRadEditor.DialogsCssFile = "~/General/App/Controls/RadEditor/Style/RadEditor_Dialogs_RTL.css";
                CntntRadEditor.ContentAreaCssFile = "~/General/App/Controls/RadEditor/Style/EditorContentArea_RTL.css";
                CntntRadEditor.CssFiles.Add(new EditorCssFile("~/General/App/Controls/RadEditor/Style/EditorContentArea_RTL.css"));
                EditorRtl.Attributes["Href"] = "General/App/Controls/RadEditor/Style/Editor_RTL.css";
            }
     
            public string EditorContent
            {
                get
                {
                    //string s = Convert.ToString(ViewState["EditorContent"]);
                    return Convert.ToString(ViewState["EditorContent"]);
                }
                set
                {
                    ViewState["EditorContent"] = value;
                }
            }
        }
    }

     

    Sample formview control:

    <asp:SqlDataSource ID="SqlDataSource1" runat="server"
                    ConnectionString="<%$ ConnectionStrings:GeneralConnectionString %>"
                    SelectCommand="SELECT * FROM [gPagesContent] WHERE ([PageID] = 41)">
                </asp:SqlDataSource>
                   
                <asp:FormView ID="FormView1" runat="server" DataKeyNames="PageID"
                    DataSourceID="SqlDataSource1" Width="100%">
                    <ItemTemplate>
                        <table width="100%" cellpadding="0" cellspacing="0" border="0">
                            <tr>
                            <td valign="top" width="400">
                                <asp:Label ID="Label2" runat="server" Text="By displaying content using Label:" ></asp:Label>
                            </td>
                            <td valign="top" width="*">
                                <asp:Label ID="Label1" runat="server" Text='<%# Eval("PContent", "{0}") %>'></asp:Label>
                            </td>
                            </tr>
                            <tr>
                            <td valign="top" width="400">
                                <asp:Label ID="ContentLabel1" runat="server" Text="By displaying content using RadEditor:" ></asp:Label>
                            </td>
                            <td valign="top" width="*">
                                <uc1:DefaultUserControl ID="DefaultUserControl1" EditorContent='<%# Eval("PContent", "{0}") %>' runat="server" />
                            </td>
                            </tr>
                        </table>
                    </ItemTemplate>
                </asp:FormView>


    Please, I need your help,

    Regards,
    Bader

Back to Top