SpellChecking multiple textboxes and r.a.d.editor concurrently

1 posts, 0 answers
  1. Telerik Admin
    Telerik Admin avatar
    1679 posts
    Member since:
    Oct 2004

    Posted 12 Apr 2006 Link to this post

     

    Requirements

    r.a.d.editor version

    5.0+

    r.a.d.spell version

    2.0+

    .NET version

    all

    Visual Studio version

    all

    programming language

    JavaScript

    browser support

    Internet Explorer 6+ /
    Mozilla based browsers


     
    The best way to accomplish this task is to disable the editor's internal SpellCheck tool, add a RadSpell declaration on the page and create a custom RadEditor tool for external spell checking. Here are the step by step instructions:
    1. Here are the editor, spell and textboxes declarations used in the example's aspx file:

      <asp:textbox runat="server" id="TextBox1">Tezt</asp:textbox>
      <rads:radspell runat="server" id="RadSpell1" controltocheck="TextBox1" isclientid="false"></rads:radspell><br
      >
      <asp:textbox runat="server" id="TextBox2">Texr</asp:textbox
      >
      <rads:radspell runat="server" id="Radspell2" controltocheck="TextBox2" isclientid="false"></rads:radspell><br
      >
      <rade:radeditor id="RadEditor1" runat="server" toolsfile="~/ToolsFile.xml">Some mispeled cintent</rade:radeditor><br> 

    2. The second step is to disable the SpellCheck tool in the RadEditor toolsfile and to add a new custom tool. Set the iconurl property in order to display the original SpellCheck icon:

      <root>
        <tools name="MainToolbar" dockable="true">
          <!-- tool name="SpellCheck" shortcut="F7"/ -->
          <tool name="ExternalSpellCheck" shortcut="F7" showtext="false" iconurl="SpellCheck.gif"/>
          ...
        </tools>
        ...
      </root>

    3. Create a RadEditor text source javascript object:

      <script type="text/javascript">
      function RadEditorSource(editor)
      {
        this.editor = editor;
        this.getText = function()
        {
          return this.editor.GetHtml();
        }
        this.setText = function(text)
        {
          this.editor.SetHtml(text);
        }
      };

      //Add here the code from the next step

      </script>
    4. Add script for the custom tool. Note that the key in the RadEditorCommandList object must be the same as the name attribute in the tool declaration:

      RadEditorCommandList["ExternalSpellCheck"] = function(commandName, editor, oTool)
      {
        //We will use one of the TextBox spells for spell checking the editor
        var spellChecker = RadSpell.getSpellChecker('<%= RadSpell1.ClientID %>');
        spellChecker.setTextSource(new RadEditorSource(editor));
        spellChecker.startSpellCheck();
      };
    5. Use the standard steps for TextBox/TextArea spell checking.

    Attached is a sample example, containing the result of the above steps. To run the example, simply extract the content of the archive to your web application (having r.a.d.editor and r.a.d.spell in it) root folder and start the aspx file from your browser.
     

Back to Top