New to Telerik UI for ASP.NET AJAX? Download free 30-day trial

Client-side Configuration

Changing spell properties on the client side.


This example demonstrates how you could launch RadSpell with client-side code.  You can now change some of the parameters by using the RadSpell object without posting back to the server.

The required steps are as follows:

  • Obtain a RadSpell reference by using the static getRadSpell method, passing it the RadSpell ClientID
  • Set the properties
  • Start the spellchecking by calling the startSpellCheck method.

Note: When checking a client-side element you need to set the IsClientID property to true.

  • DefaultCS.aspx
  • DefaultCS.aspx.cs
<%@ Page Language="c#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="Telerik.Web.Examples.Spell.ClientConfiguration.DefaultCS" %>

<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
    <title>Telerik ASP.NET Example</title>
</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-narrow">
        <strong>Changing <strong>spell</strong> properties on the client side.</strong><br />
        <br />
        <textarea id="textarea1"  style="width:100%; height:100px">Thisz is a client side TEXTAREA with some delibirate mistakees.</textarea>
        <br />
        <telerik:RadSpell RenderMode="Lightweight" ID="spell1" runat="server" ControlToCheck="textarea1" IsClientID="true"
            ButtonType="None"></telerik:RadSpell>
        <ul>
            <li><a href="javascript:void(0);" onclick="setDictionary('en-US'); return false;">English
                (US) dictionary language.</a></li>
            <li><a href="javascript:void(0);" onclick="setDictionary('de-DE'); return false;">German
                dictionary language.</a></li>
            <li><a href="javascript:void(0);" onclick="setDictionary('fr-FR'); return false;">French
                dictionary language.</a></li>
        </ul>
        <script type="text/javascript">

            function setDictionary(lang) {
                var spellChecker = GetRadSpell('<%= spell1.ClientID %>');
                spellChecker.set_dictionaryLanguage(lang);
                spellChecker.startSpellCheck();
            }
        </script>
    </div>
    </form>
</body>
</html>

Support & Learning Resources

Find Assistance