Web Wiz Rich Text Editor (RTE)

Print Page | Close Window

TAB-key support

Printed From: Web Wiz Forums
Category: Web Wiz Web App Support Forums
Forum Name: Web Wiz Rich Text Editor (RTE)
Forum Description: Support forum for the Web Wiz Rich Text Editor (RTE).
URL: https://forums.webwiz.net/forum_posts.asp?TID=24653
Printed Date: 28 March 2026 at 9:09pm
Software Version: Web Wiz Forums 12.08 - https://www.webwizforums.com

Topic: TAB-key support

Posted By: delpierro
Subject: TAB-key support
Date Posted: 16 October 2007 at 10:53pm

I'm trying to get the Tab-key working for this textarea but without any luck.

Maybe because this textarea is in a iframe???

you can see a sample here: http://www.siteexperts.com/tips/elements/ts34/page1.asp - http://www.siteexperts.com/tips/elements/ts34/page1.asp

(this sample uses CTRL-TAB)

Replies:

Posted By: WebWiz-Bruce
Date Posted: 17 October 2007 at 8:05am

The example you link to doesn't do anything, at least in my browser, it just jumps to the bottom of the page when I hit the TAB key.

In the Web Wiz RTE if you hit TAB it leaves a TAB ie:-

This is tabbed text another two tabs on.

-------------
https://www.webwiz.net/web-wiz-forums/forum-hosting.htm" rel="nofollow - Web Wiz Forums Hosting
https://www.webwiz.net/web-hosting/windows-web-hosting.htm" rel="nofollow - ASP.NET Web Hosting

Posted By: delpierro
Date Posted: 17 October 2007 at 4:31pm

try CTRL-TAB

code:

if ((document.all) && (9==event.keyCode) && (event.ctrlKey)) {

can be changed to:

if ((document.all) && (9==event.keyCode)) {

Posted By: WebWiz-Bruce
Date Posted: 17 October 2007 at 4:54pm

Even in the example you link to CTRL -> TAB just changes between the TABs in the browser at the top of the screen.

It looks like some old code for IE 4, so doesn't seem to work in new browsers with TAB's so not sure what it's meant to do.

-------------
https://www.webwiz.net/web-wiz-forums/forum-hosting.htm" rel="nofollow - Web Wiz Forums Hosting
https://www.webwiz.net/web-hosting/windows-web-hosting.htm" rel="nofollow - ASP.NET Web Hosting

Posted By: delpierro
Date Posted: 17 October 2007 at 7:34pm

above example works for me with IE6, but there is another example at:

http://www.webdeveloper.com/forum/showthread.php?t=32317&page=3

this works with IE6 and FireFox

code:

<html>
<head>
<script type="text/javascript">
function setSelectionRange(input, selectionStart, selectionEnd) {
if (input.setSelectionRange) {
    input.focus();
    input.setSelectionRange(selectionStart, selectionEnd);
}
else if (input.createTextRange) {
    var range = input.createTextRange();
    range.collapse(true);
    range.moveEnd('character', selectionEnd);
    range.moveStart('character', selectionStart);
    range.select();
}
}

function replaceSelection (input, replaceString) {
if (input.setSelectionRange) {
  var selectionStart = input.selectionStart;
  var selectionEnd = input.selectionEnd;
  input.value = input.value.substring(0, selectionStart)+ replaceString + input.value.substring(selectionEnd);

  if (selectionStart != selectionEnd){
   setSelectionRange(input, selectionStart, selectionStart + replaceString.length);
  }else{
   setSelectionRange(input, selectionStart + replaceString.length, selectionStart + replaceString.length);
  }

}else if (document.selection) {
var range = document.selection.createRange();

  if (range.parentElement() == input) {
   var isCollapsed = range.text == '';
   range.text = replaceString;

    if (!isCollapsed) {
    range.moveStart('character', -replaceString.length);
    range.select();
   }
  }
}
}

// We are going to catch the TAB key so that we can use it, Hooray!
function catchTab(item,e){
if(navigator.userAgent.match("Gecko")){
  c=e.which;
}else{
  c=e.keyCode;
}
if(c==9){
  replaceSelection(item,String.fromCharCode(9));
  setTimeout("document.getElementById('"+item.id+"').focus();",0);
  return false;
}

}
</script>
</head>
<body>
<form>
<textarea name="data" id="data" rows="20" columns="35" wrap="off" onkeydown="return catchTab(this,event)" ></textarea>
<input type="submit" name="submit" value="Submit"/>
</form>
</html>

Posted By: WebWiz-Bruce
Date Posted: 17 October 2007 at 7:38pm

I still don't know what you are trying to archive?

In the RTE the TAB key works as a TAB key, creating tabbed spaces between words or letters.

-------------
https://www.webwiz.net/web-wiz-forums/forum-hosting.htm" rel="nofollow - Web Wiz Forums Hosting
https://www.webwiz.net/web-hosting/windows-web-hosting.htm" rel="nofollow - ASP.NET Web Hosting

Posted By: delpierro
Date Posted: 17 October 2007 at 8:34pm

-boRg- wrote:

I still don't know what you are trying to archive?

In the RTE the TAB key works as a TAB key, creating tabbed spaces between words or letters.

Do you realy mean that?

This is not working for me. I got the latest version (free demo)

I'am using IE6.

Posted By: WebWiz-Bruce
Date Posted: 18 October 2007 at 10:25am

OK I see now what you are doing. Although Firefox, Opera, Netscape, Mozilla, Netwscape, etc. support using Tabbed spaces, in IE once it's built in RTE API is enabled there isn't away to catch the Tab key being pressed. All the usual techniques, such as keypress, keyCode, etc. do not work.

-------------
https://www.webwiz.net/web-wiz-forums/forum-hosting.htm" rel="nofollow - Web Wiz Forums Hosting
https://www.webwiz.net/web-hosting/windows-web-hosting.htm" rel="nofollow - ASP.NET Web Hosting