tab characters in my textarea

December 3, 2005 6:20 PM

HTML + javascript question. Changing the text-cursor position of a textarea?

Im writting a development tool - real time HTML and CSS editing. im trying to give the textarea the tab key back (insert a tab character rather than switching to the next item in the tab order). So far so good. The tool traps the tab key, inserts the tab character in the appropriate location - but the text cursor is then placed at the end of the text. Really annoying

have a look at it here:

rendar

PS - firefox only :)

posted by Tryptophan-5ht to computers & internet (6 comments total)

nice, with some autocompletion and you can sell it :)
posted by zouhair at 6:25 PM on December 3, 2005

thanks :D but most of it is code ive pieced together. couldn't sell it.

BTW - SOLVED! Just realized 'selectionStart' and 'selectionEnd' can be changed, not just read from :)

for posterity:

function insert(input, theText) {
if(typeof input.selectionStart != 'undefined')
{
var start = input.selectionStart;
var end = input.selectionEnd;
input.value = input.value.substr(0, start) + theText + input.value.substr(end);
input.selectionStart = start + theText.length;
input.selectionEnd = start + theText.length;
input.focus();
}
}
posted by Tryptophan-5ht at 6:31 PM on December 3, 2005

(Let me just be the one voice that says that most browser users won't be so happy that you're changing the expected behavior of their tab key; it's meant switch-to-next-item in the web world for so long that it's not a great idea to change that.)
posted by delfuego at 8:55 PM on December 3, 2005

delfuego - the change only happens on that particular page.
posted by Tryptophan-5ht at 9:09 PM on December 3, 2005

Any ideas for doing this in php?
posted by 31d1 at 1:03 PM on December 4, 2005

PHP is server-side. You have to do this with JavaScript. You can embed this JavaScript into your PHP page, though.
posted by Khalad at 4:19 PM on December 4, 2005