Spell - Finding Client Controls

Spellchecking a TEXTAREA element.




Spellchecking a DIV element.


Thisz is a client side DIV with some delibirate mistakees.

Spellchecking an IFRAME element


Isolate this demo as a stand-alone application
  • About this demo
  • C#
  • VB

In the code samples above we show how you could attach RadSpell to almost all of the HTML editable elements: textarea, div, etc. Again you have to use the ControlToCheck property, but since this time the spellchecker is launched client-side you also have to set the IsClientID property to "true".

e.g.
<telerik:RadSpell id=spell1 ButtonCssClass="button" IsClientID="true" ControlToCheck="textarea1" Runat="server"></telerik:RadSpell>

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
  • scripts.js
  • styles.css
<%@ Page CodeFile="DefaultCS.aspx.cs" Language="c#" AutoEventWireup="true" Inherits="Telerik.Web.Examples.Spell.ClientSide.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
    <script type="text/javascript" src="Scripts.js"></script>
    <link href="Styles.css" rel="stylesheet" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
    <telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
    <div class="demo-container size-medium">
        <table width="98%" cellspacing="11" cellpadding="0">
            <tr>
                <td class="module" style="height: 200px;">
                    <strong>Spellchecking a TEXTAREA element.</strong><br />
                    <br />
                    <br />
                    <textarea id="textarea1" style="width:260px; height:100px">Thisz is a client side TEXTAREA with some delibirate mistakees.</textarea><br />
                    <br />
                    <telerik:RadSpell RenderMode="Lightweight" ID="Radspell1" runat="server" ControlToCheck="textarea1" IsClientID="true"></telerik:RadSpell>
                </td>
                <td class="module" style="height: 200px;">
                    <strong>Spellchecking a DIV element.</strong><br />
                    <br />
                    <br />
                    <div id="div1" style="width: 260px; height: 100px; border: 1px solid #666666; overflow: auto">
                        Thisz is a client side DIV with some delibirate mistakees.
                    </div>
                    <br />
                    <telerik:RadSpell RenderMode="Lightweight" ID="Radspell2" runat="server" ControlToCheck="div1" IsClientID="true"></telerik:RadSpell>
                </td>
            </tr>
            <tr>
                <td class="module" colspan="2">
                    <strong>Spellchecking an IFRAME element</strong><br />
                    <br />
                    <div id="iframeHolder">
                    </div>
                    <br />
                    <telerik:RadSpell RenderMode="Lightweight" ID="Radspell3" runat="server" ControlToCheck="iframe1" IsClientID="true"></telerik:RadSpell>
                </td>
            </tr>
        </table>
    </div>
    </form>
</body>
</html>

Find Assistance

Help Us Improve

Was this example helpful?