How to allow tab key in TextArea?

Posted By Vitaliy | July 06, 2012 | ExtJS 4.1.0
0 3524
We should stop event on tab pressed and insert tab symbol at cursor position.

Js Code

Ext.widget('textareafield', {
	width: 300,
	height: 100,
	enableKeyEvents: true,
	tabText: '\t',
	listeners: {
		keydown: function (f, e) {
			if (e.getKey() == e.TAB) {
				e.stopEvent();
				f.insertAtCursor(f.inputEl.dom, f.tabText);
			}
		}
	},
	insertAtCursor: function (el, ins) {
		if (el.setSelectionRange) {
			var withIns = el.value.substring(0, el.selectionStart) + ins;
			var pos = withIns.length;
			el.value = withIns + el.value.substring(el.selectionEnd, el.value.length);
			el.setSelectionRange(pos, pos);
		}
		else if (document.selection) {
			document.selection.createRange().text = ins;
		}
	},
	renderTo: Ext.getBody()
});