KB: How do I do as-you-type in an ASP page?

Knowledgebase Home Page > RapidSpell Web ASP.NET > Misc

Search the Knowledge Base

How do I do as-you-type in an ASP page?
https://keyoti.com/kb/Default.aspx?ToDo=view&questId=200&catId=60

Options

Print this page
Email this to a friend

First, follow http://keyoti.com/kb/Default.aspx?ToDo=view&questId=53&catId=60 in order to implement basic inline checking in ASP.

Once that has been done, you're ready to supplement it with the extras for as-you-type checking.

1. Add this block to your page, or a JS file

2. Instead of a conventional textarea tag, use this for the textbox

<textarea id="TextBox1" rows="11" cols="42" style="font-family: batang;
font-size:10pt;"
   style="display:none;"
   >Hello firends of ASP</textarea>

   <iframe id="TextBox1_IF" src='/Keyoti_RapidSpell_Web_Common/blank.html'
style="
border-width:1px;border-color:#7f9db9;border-style:Solid;height:213px;width:707px;TOP:107px;LEFT:89px;Z-INDEX:101;"

frameborder='0'></iframe>

   <script type='text/javascript'>/*<![CDATA[*/rsw_addTBConfig(
{keys:["elementID","enabled", "CssSheetURL", "multiline",
"ifDoc.body.className","iframe.style.height","iframe.style.width","iframe.style.position","iframe.style.top","iframe.style.left","iframe.style.zIndex","ifDoc.body.style.backgroundColor","iframe.style.borderColor","maxlength","ifDoc.body.style.color","iframe.style.borderStyle","iframe.style.borderWidth","ifDoc.body.style.fontSize","ifDoc.body.style.fontWeight","ifDoc.body.style.fontStyle","ifDoc.body.style.fontFamily","ifDoc.body.style.textDecoration","textIsXHTML"],

values:["TextBox1_IF",true,"",true,"'RS_MultiLineTB'","'213px'","'707px'","'absolute'","'107px'","'89px'","'101'","''","'#7f9db9'","'0'","'#000000'","'Solid'","'1px'","'10pt'","'normal'","'normal'","'Verdana'","'none'","false"]}

);
var RapidSpellWInlineTextBox1_JSObj = new RSWITextBox('TextBox1');/*]]>*/</script><script
type='text/javascript'>/*<![CDATA[*/var control = document.getElementById('TextBox1_IF');
control.Validators = new Array();/*]]>*/</script>

This section
"'213px'","'707px'","'absolute'","'107px'","'89px'"

controls; height, width, positioning, posX, posY.

Change 'absolute' to 'relative' if you prefer.

The complete page is below (it requires the supplemental client files and rswihelper.aspx per the instructions in the article mentioned at the top.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<title></title>
<meta name="GENERATOR" content="Microsoft Visual Studio .NET 7.1">
<meta name="ProgId" content="VisualStudio.HTML">
<meta name="Originator" content="Microsoft Visual Studio .NET 7.1">



<script type='text/javascript'>var oldEvt2 = document.onclick; document.onclick = function(ev) { if (oldEvt2) oldEvt2();var gEvent;if(window.event){gEvent=window.event;}else{gEvent=ev;}var gTar;if(gEvent.target){gTar=gEvent.target} else {gTar = gEvent.srcElement;}var gParent; if(gTar!=null && gTar.parentNode){gParent=gTar.parentNode;} else {gParent=gTar.parentElement;}if(gTar!=null && gTar.className!='rs_err_hl' && (gParent==null || gParent.className!='rs_err_hl')) rsw_hideCM(); } </script>
<script type='text/javascript' src='/Keyoti_RapidSpell_Web_Common/inline.js'></script><script type='text/javascript'>rsw_rs_styleURL = '/Keyoti_RapidSpell_Web_Common/rs_style.css';</script>
<LINK href='/Keyoti_RapidSpell_Web_Common/rs_style.css' type='text/css' rel='stylesheet'><LINK href='/Keyoti_RapidSpell_Web_Common/menu.css' type='text/css' rel='stylesheet'>
<script>var oldEvt = window.onload; window.onload = function() { if (oldEvt) oldEvt(); rsw__init(); };</script>
    <script>
function rsw_inline_button_OnStateChanged(state, buttonID, buttonTextSpellChecking, buttonTextSpellMode, buttonText){
var button = document.getElementById(buttonID);
if(button!=null && state=='TRANSITION-CHECKING'){ button.value=buttonTextSpellChecking; button.disabled = true;}
if(button!=null && state=='CHECKING'){ button.value=buttonTextSpellMode;button.disabled = false;}
if(button!=null && state=='EDITING'){ button.value=buttonText;button.disabled = false;}
}
</script>
</head>
<body>
<form ID="Form1">
   <textarea id="TextBox1" rows="11" cols="42" style="font-family: batang; font-size:10pt;"
   style="display:none;"
   NAME="TextBox1">Hello firends of ASP</textarea>

   <iframe id="TextBox1_IF" src='/Keyoti_RapidSpell_Web_Common/blank.html' style=" border-width:1px;border-color:#7f9db9;border-style:Solid;height:213px;width:707px;TOP:107px;LEFT:89px;Z-INDEX:101;" frameborder='0'></iframe>

}
function _INT_notifyTextBoxListeners(eventName){
if(eventName=="keyup") {clearTimeout(rsw_autoCheckTimeout);
rsw_autoCheckTimeout=null;
if(rsw_autoCheckTimeout==null)
rsw_autoCheckTimeout = setTimeout('rs_AYT.onPause()', rsw_recheckDelay); } else if(eventName == "keydown" ){ clearTimeout(rsw_autoCheckTimeout);
rsw_autoCheckTimeout=null;}else if(eventName == "spellcheckfinish"
)rs_AYT.onFinish();
}
function onRSTextBoxesInit() { rs_AYT = new RapidSpell_Web_AsYouType();
rs_AYT.checkAsYouTypeOnPageLoad = true;
rs_AYT.onTextBoxesInit();
}
function _notifySpellCheckListeners(eventName){
if(eventName=='ayt_finished_initializing'){var sx=0;var sy=0;
if(document.getElementById('__SCROLLPOSITIONX')!=null)
{sx=document.getElementById('__SCROLLPOSITIONX').value;sy=document.getElementById('__SCROLLPOSITIONY').value;}
if(sx>0||sy>0)window.scrollTo(sx, sy); }} /*]]>*/</script>