Dart : Pressing TAB in TextArea

[Supakorn Suttiruang]

Hello again Happy Dartisans!

I'm trying to register an Event for my textarea to listen to TAB key

as you can see my code below...

void tabHandler(KeyboardEvent e) {
    KeyEvent textKey = new KeyEvent.wrap(e);
    textKey.preventDefault();
    if (textKey.keyCode == KeyCode.TAB) {
        print('tabbed');
    }
    textKey.preventDefault();
}

but obviously it doesn't seen to work :(

 whenever I press TAB the textarea loses focus

my real purpose is to enable the Tab Character in my textarea but I stuck on the EventListener part

If you guys know how to enable tab character (indentation) please let me know :)

I did a research and I guess I can add a tab character UTF code to my textarea like : textArea.value += 'utfcodeblahblah';

Please let me know if I'm on the right track :D and please share you tab character UTF code and how to escape it in a string (I'm so new to this and full of concern)

Thank you so much in advance!!!!

I love you Seth Ladd :D

[Jos Hirth]

In strings, tab characters can be represented with "\t".

Here is how it can be done:

import 'dart:html';

void main() {
  TextAreaElement editor = querySelector('textarea#editor');
  editor.onKeyDown.listen((KeyboardEvent e) {
    if (e.keyCode == KeyCode.TAB) {
      e.preventDefault();
      String contents = editor.value;
      editor.value = contents.substring(0, editor.selectionStart)
          + '\t'
          + contents.substring(editor.selectionEnd);
    }
  });
}

[Jos Hirth]

Forgot to fix the selection. Whoops. :)

import 'dart:html';

void main() {
  TextAreaElement editor = querySelector('textarea#editor');
  editor.onKeyDown.listen((KeyboardEvent e) {
    if (e.keyCode == KeyCode.TAB) {
      e.preventDefault();
      String contents = editor.value;

      int pos = editor.selectionStart + 1;

      editor.value = contents.substring(0, editor.selectionStart)
          + '\t'
          + contents.substring(editor.selectionEnd);

      editor.selectionStart = pos;
      editor.selectionEnd = pos;
    }
  });
}

[Supakorn Suttiruang]

Thank you so much Jos :)
but why do you use selectionStart? please explain :)

[Jos Hirth]

If you write "foobarbaz", highlight "bar", and press tab, the result should be "foo\tbaz". The "bar" part is supposed to be replaced by a tab character.

If you do the same thing with "x" instead of tab, the result is "fooxbaz". The code above just mirrors this behavior.

The "+ 1" part is for the tab character. The caret should be placed after this freshly inserted tab character.

[Supakorn Suttiruang]

Thank you so much :)

--
For other discussions, see https://groups.google.com/a/dartlang.org/
 
For HOWTO questions, visit http://stackoverflow.com/tags/dart
 
To file a bug report or feature request, go to http://www.dartbug.com/new

To unsubscribe from this group and stop receiving emails from it, send an email to misc+uns...@dartlang.org.

--

This Gmail is from Lum.

Gmail นี้ถูกส่งมาโดย Lum ครับ