2

I'm trying to implement a multiline textbox on a website. The textbox should offer a kind of autocompletion while the user is typing. The autocompletion should work similar to what is known as 'Intellisense' in ms visual studio (see screenshot below) and display the autocompletion selection (the list containing "bar", and "foo_bar") just below the textcursor.

I have started with a simple html textarea. I have found several jQuery-Plugins that help me in manipulating the textarea but one very basic problem remains.

How can I know where to position the autocompletion selection (the list containing "bar", and "foo_bar" in the screenshot)?

What html-element,text-editor,technique or plugin could help me to position the autocompletion selection right below the text cursor?

Thanks a lot

JJ

Following an example of how "intellisense" looks like:

alt text

Enceradeira
  • 387
  • 4
  • 15
  • possibly duplicate of http://stackoverflow.com/questions/2955244/html-selection-range-getting-the-range-starting-node-ending-node-distan – Ravindra Sane Nov 03 '10 at 18:38

1 Answers1

1

The JavaScript event.clientX and event.clientY functions will return the coordinates of an event. Bind these functions to an onkeydown event in your textarea to find out where the cursor is positioned.

Will Peavy
  • 2,349
  • 3
  • 21
  • 21
  • I tried it and it seems to work for mouse-events. But it doesn't seem to work for keyboard-events. I've found a website that has implemented exactly what I would like to do (http://ajaxime.chasen.org/) and they use a rather complicated workaround to determine the position of the text-cursor (caret). (see explanations on http://markmail.org/message/p3ejuxjpebigvmro). Is there no easier way to find out the position of the textcursor? – Enceradeira Nov 05 '10 at 11:34