OnCLientLoad event -disabling RAD Editor

21 posts, 0 answers
  1. Anandi
    Anandi avatar
    15 posts
    Member since:
    Jun 2009

    Posted 09 Jul 2009 Link to this post

    HI,
    How can I call 2 different functions in the OnClientLoad event based on an If condition? Here is my requirement: In the View mode, I want to disable typing/pasting etc , but in the edit mode, I need to limit them  to typing a particular no. of characters. -say 2000.
    I figured out that OnclientLoad will be the place to call the function for that, but I am not sure how to call different functions in runtime.  Or, is there some propety that I can set in the aspx page that I can capture in the RAD user control and use in the if condition ??
    Using of the property RADEditor1.enabled=false just gives the text without the RAD control and we cannot use that. Please help.

    Thanks a lot.
    Anandi
  2. Rumen
    Admin
    Rumen avatar
    12849 posts

    Posted 14 Jul 2009 Link to this post

    Hello Anandi,


    You should attach to the OnClientModeChange event property of RadEditor which is fired when the editor's mode is changed, e.g.

    <telerik:RadEditor ID="RadEditor" runat="server" OnClientModeChange="OnClientModeChange"></telerik:RadEditor>  
    <script type="text/javascript"
    function OnClientModeChange(editor)  
    {  
           var mode = editor.get_mode();                      
           switch (mode) 
           { 
              case 1: 
               alert( "We are in Design mode"); 
               //do something 
               break
              case 2: 
               alert( "We are in Html mode"); 
               //do something 
               break
              case 4: 
               alert( "We are in Preview mode"); 
               //do something 
               break
          } 
    }   
    </script> 


    All the best,
    Rumen
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. Anandi
    Anandi avatar
    15 posts
    Member since:
    Jun 2009

    Posted 14 Jul 2009 Link to this post

    Thanks Rumen, for replying.
    I still don't understand. These are the editor modes, right? I want the RAD editor to allow typing until 2000 characters in edit mode and while viewing the data, the user should not be able to type anything.
  5. Rumen
    Admin
    Rumen avatar
    12849 posts

    Posted 17 Jul 2009 Link to this post

    Hi Anandi,

    Let me clarify something: RadEditor has Design, Html and Preview view modes. What do you mean by View and Edit modes?

    Please, also note that the OnClientLoad method is executed only once after the editor load and not when switching between the different view modes.

    If you want to execute some code when the user changes some mode then you should attach your javascritp code to the OnClientModeChange event property of RadEditor.

    You can implement a symbol counter in Design mode using the code provided in this forum thread:  Character Counter on HTML Source side of Editor.

    You can disable the typing in Html mode using the solution in this KB article: Disabling HTML editing in Html mode of RadEditor.

    Best regards,
    Rumen
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  6. Anandi
    Anandi avatar
    15 posts
    Member since:
    Jun 2009

    Posted 20 Jul 2009 Link to this post

    Hi Rumen,
    Thanks for the reply.  Let me clarify. In our application, we load our pages in 2 modes. -View and Edit modes.  In the View mode, the user cannot change anything in the page -he can only View the page. In the edit mode, he can type something. Now, in my page, I have 5 RAD editors. 2 of them may be in the disable mode and others may be editable.  If I create a property setMode  for the Rad editor in the user control, like this:

     

    Public WriteOnly Property SetMode() As String
            Set(ByVal Value As String)
                strMode = Value
             End Set
        End Property

    and set the mode in my page - a few to View and a few to Edit, I want them to be editable if the value is edit and not editable if the value is View. I check the condition in the OnClientLoad function in the user control. But the problem right now is, all the RAD editors in the page, take the last assigned value. For eg, if the first 2 have setMode="View" , and the next 3 have setMode=Edit, then they all take "Edit" as the setMode property value and vice versa.

    Can you please help me with this problem -every instance of the RAD should have its own value for the property that I create. How can I achieve it??
    I hope I have explained it clearly enough for you to understand. If not, please come up with questions.

    Thanks a lot.

    Anandi

  7. ManniAT
    ManniAT avatar
    877 posts
    Member since:
    Nov 2003

    Posted 20 Jul 2009 Link to this post

    Hi Anadi,

    yes I have questions. The VBCode looks like a "code behind" property.
    So this would be executed on server - am I right?

    But on the other hand you write that you "check condition" in ClientLoad.
    Is it possible that you have Client VB as script?

    If the VB thing runs on server I guess that you wire up that string strMode somewhere to the RadEditors mode.
    But if it is like this - what do you do in the load on client?

    Maybe my brain lags - but I need a bit more information

    Manfred
  8. Anandi
    Anandi avatar
    15 posts
    Member since:
    Jun 2009

    Posted 20 Jul 2009 Link to this post

    Hi Manfred,
    Thanks for responding. I will try to answer all your questions:

    Yes. That is a code behind property which I am creating for the the RAD Editor in the user control. Then, when I use this user control in my page, I want to set different value for each instance of the RAD user control in my page. I get the value of the mode in the user control by this method:

     

    Protected Sub Page_PreRender(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.PreRender

     

     

    If (Not Page.ClientScript.IsClientScriptBlockRegistered("csbJS")) Then

     

    Page.ClientScript.RegisterClientScriptBlock(Page.GetType(),

    "csbJS", "<script language=Javascript>var MaxLength=" & intMaxLength & "; var strMode='" & strMode & "';</script>")

     

     

    End If

     

     

    End Sub
    Then, in the OnClientLoad function of the user control, I do the check to restrict user typing in the RAD Editor.
    If strMode="View", then, do not let him type or paste anything in the RAD.
    If strMode="Edit", let him modify.

    Thanks.

     

  9. ManniAT
    ManniAT avatar
    877 posts
    Member since:
    Nov 2003

    Posted 20 Jul 2009 Link to this post

    Hi,

    this explains a lot :)
    When you examine the emitted code you will find a lot of "var MaxLenght=....; varStr...=...;" codeblocks.

    You have one "instance" of your javascript on a page.
    JS allows (without an error message) to define the same (named) var as often as you want.
    And what you do to one var - you do (virtually) to all of them.
    Simple - jscript "chooses"  one these vars as the one which is "in scope".

    So your code looks (reduced to strModes) like this
    ....
    var strMode="ReadOnly";
    var strMode="ReadOnly";
    var strMode="Edit";
    var strMode="Edit";
    var strMode="Edit";

    Now the functions (OnLoad) in your first control fires and does
    ..radEditor.set_mode(strMode);
    the second does
    ..radEditor.set_mode(strMode);

    and so on.
    The value of "strMode" is???? It is the last assigned value.
    In this case "Edit".

    Now (because I don't understand it totally).
    You have a page - this page contains 5 usercontrols. Each of these has a SetMode property.

    Where do you set this?
    1.) In the control (code behind) - after loading data?
    2.) In the page (code behind) (after loading data) assigning the values to the controls?
    3.) Somehow via DataBinding?

    I don't think your control exposes this SetMode as a client "variable".

    So one of the first 2 is the fact I guess?
    Or am I wrong?
    Please (just to be sure) let me know if the Page_PreRender is from the page (containing the controls) or in the controls?

    We're on the way to a solution - I hope :)

    Regards

    Manfred
  10. Anandi
    Anandi avatar
    15 posts
    Member since:
    Jun 2009

    Posted 20 Jul 2009 Link to this post

    1. I am setting the mode value in the page_load event of the page where I am using the user controls.

    2. page_prerender code is in the code behind in the user control page.

     

    Thanks a lot.

  11. ManniAT
    ManniAT avatar
    877 posts
    Member since:
    Nov 2003

    Posted 20 Jul 2009 Link to this post

    Ok,

    than in the usercontrol (PreRender would be a good place) simply assign the Property value of SetMode to the EditModes of the RadEditor.
    Forget about your scripts - you don't need it - the job can be done on the server.
    To make it work don't forget to remove the Loaded event (at least the mode setting code there) from the Client Scripts.
    The only "trick" is to change the string to an EditModes enum.
    Or define the property as EditModes.
    First the new definition:
    Private strMode As EditModes  
    Public WriteOnly Property SetMode() As EditModes  
         Set(ByVal Value As String)  
           strMode = Value 
           End Set  
    End Property 

    The code looks like this:
    protected override void OnPreRender(EventArgs e) {  
        RadEditorInControl.EditModes = strMode;  
    }  
     
    This should do what you expect to do.
    In the page code would look something like this:
    Protected Sub Page_Load(sender As Object, e As EventArgs)  
        If OnlyReadForTheFirst2CEditors Then  
            myUserCtrlONE.SetMode = EditModes.Preview  
            myUserCtrlTWO.SetMode = EditModes.Preview  
        Else  
            myUserCtrlONE.SetMode = EditModes.Html OrElse EditModes.Design  
            myUserCtrlTWO.SetMode = EditModes.Html OrElse EditModes.Design  
        End If  
        myUserCtrlTHREE.SetMode = EditModes.Html OrElse EditModes.Design  
        myUserCtrlFOUR.SetMode = EditModes.Html OrElse EditModes.Design  
        myUserCtrlFIVE.SetMode = EditModes.Html OrElse EditModes.Design  
     
    End Sub  
     
    The "pseudo bool" OnlyReadForTheFirst2Editors is just the thing you get from your database.
    Give this a try - and don't forget to change the client scripts!

    Regards

    Manfred
  12. Anandi
    Anandi avatar
    15 posts
    Member since:
    Jun 2009

    Posted 21 Jul 2009 Link to this post

    HI Manfred,
    Thanks a lot for the detailed reply. The prerender code should go in the user control, right? That is what I did.  I gave the first one as preview mode and then the next RAD as design mode, If does load the first rad in the preview mode as the top bar is greyed out, but it doesn;t load all the rest with data ad wouldn't let me type anything too in there,...BUt the top bar is not greyed out for the next one,,So, there is some improvement , but I am not sure why it wouldn't let me type anything in the second one. I have a bunch of javascript for chracter counting, word counting etc. They are also not getting displayed. Any idea why this can be?
    Than you again for taking the time to look into my issue.

    Anandi
  13. ManniAT
    ManniAT avatar
    877 posts
    Member since:
    Nov 2003

    Posted 22 Jul 2009 Link to this post

    Hi,

    yes - the first two codeblocks are for the control - the third is for the page.
    And if it doe's "strange things" it would first remove (disable) all scripts just to see if it works than.

    I prepared a little sample:
    http://www.pp-p.net/EditorTester.aspx

    The (of course simple) usercontrol looks like this:
    <%@ Control Language="C#" AutoEventWireup="true" CodeBehind="EditorHolder.ascx.cs" Inherits="PPPNet.EditorHolder" %> 
    <telerik:RadEditor ID="reMine" runat="server" Height="200px">  
    <Content> 
    Just a test  
    </Content> 
    </telerik:RadEditor> 
     
    And the code behind:
    public partial class EditorHolder : System.Web.UI.UserControl {  
     
        #region EditMode  
        private EditModes m_emEditMode;  
        public EditModes EditMode {  
            set { m_emEditMode = value; }  
        }  
        #endregion  
     
        protected void Page_Load(object sender, EventArgs e) {  
     
        }  
        protected override void OnPreRender(EventArgs e) {  
            reMine.EditModes = m_emEditMode;  
            base.OnPreRender(e);  
        }  
    }  
    The Page markup:
    <body> 
        <form id="form1" runat="server">  
        <telerik:RadScriptManager runat="server">  
        </telerik:RadScriptManager> 
        <div> 
            <uc1:EditorHolder ID="EditorHolder1" runat="server" /> 
            <br /> 
            <uc1:EditorHolder ID="EditorHolder2" runat="server" /> 
            <br /> 
            <uc1:EditorHolder ID="EditorHolder3" runat="server" /> 
            <br /> 
            <uc1:EditorHolder ID="EditorHolder4" runat="server" /> 
            <br /> 
            <uc1:EditorHolder ID="EditorHolder5" runat="server" /> 
            <br /> 
        </div> 
        </form> 
    </body> 
     
    And the code behind
    protected void Page_Load(object sender, EventArgs e) {  
        EditorHolder1.EditMode = Telerik.Web.UI.EditModes.Preview;  
        EditorHolder2.EditMode = Telerik.Web.UI.EditModes.All;  
        EditorHolder3.EditMode = Telerik.Web.UI.EditModes.Preview;  
        EditorHolder4.EditMode = Telerik.Web.UI.EditModes.All;  
        EditorHolder5.EditMode = Telerik.Web.UI.EditModes.All;  
     
    }  
     

    So the first and the thrid editor are "read only".

    Regards

    Manfred
  14. Anandi
    Anandi avatar
    15 posts
    Member since:
    Jun 2009

    Posted 22 Jul 2009 Link to this post

    Hi Manfred,
    Thanks a lot. When I removed the javascript, it worked perfectly!!!!

     

  15. rhodmie sagum
    rhodmie sagum avatar
    8 posts
    Member since:
    Mar 2010

    Posted 05 May 2010 Link to this post

    Hi Rumen,

    i just want to ask why am i receiving an Error: Object doesn't support this property or method exception? all i do is call the javascript in code behind let say

    SampleRadEditor.OnClienModeChange = "OnClienModeChange"

    then in my page i put this code

        function OnClientModeChange(editor) { 
            var mode = editor.get_mode(); 
            switch (mode) { 
                case 1: 
                    alert("We are in Design mode"); 
                    //do something 
                    break
                case 2: 
                    alert("We are in Html mode"); 
                    //do something 
                    break
                case 4: 
                    alert("We are in Preview mode"); 
                    //do something 
                    break
            } 
        } 

    then i received an exception, please see attached file

    Thanks,
    Rhodmie


  16. Rumen
    Admin
    Rumen avatar
    12849 posts

    Posted 10 May 2010 Link to this post

    Hi Rhodmie,

    I saw that you have missed the t letter in the OnClientModeChange property and its value. You should correct it to:

    SampleRadEditor.OnClientModeChange = "OnClientModeChange";

    For your convenience I have attached a sample working project.

    Sincerely yours,
    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.
  17. rhodmie sagum
    rhodmie sagum avatar
    8 posts
    Member since:
    Mar 2010

    Posted 11 May 2010 Link to this post

    Rumen,

    Thanks, it's my bad.  Also it seems that 

    editor.get_mode();  must be  editor.GetMode();




  18. Rumen
    Admin
    Rumen avatar
    12849 posts

    Posted 13 May 2010 Link to this post

    Hi Rhodmie,

    I am glad that the problem was fixed.

    It seems that you use the classic version of RadEditor, because GetMode() is a method of RadEditor Classic (RadEditor.<Net2>.dll).

    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.
  19. rhodmie sagum
    rhodmie sagum avatar
    8 posts
    Member since:
    Mar 2010

    Posted 13 May 2010 Link to this post

    Hi Rumen,

    In line to this, is there a way to disable a part of the toolbar in code behind for example in .cs file? in our case the BackColor tool

    Thanks,
    Rhodmie
  20. Rumen
    Admin
    Rumen avatar
    12849 posts

    Posted 13 May 2010 Link to this post

    Hi Rhodmie,

    You can see how to remove toolbar buttons from the toolbar of:

    Sincerely,
    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.
  21. vishal
    vishal avatar
    11 posts
    Member since:
    Jul 2010

    Posted 23 Mar 2011 Link to this post

    hi rumen,
    i am using radeditor version v2.0.50727
    it is giving me exception while executing client event onclientload Error: object doesn’t support this property or method

    is this problem of version i am using? cause its working fine with new version of radeditor.

  22. Rumen
    Admin
    Rumen avatar
    12849 posts

    Posted 23 Mar 2011 Link to this post

    Hi,

    RadEditor v2.0.50727 does not offer the OnClientLoad property. This is a very old version, the development and support of which is terminated.

    Best regards,
    Rumen
    the Telerik team
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017