diff --git a/public/src/modules/composer.js b/public/src/modules/composer.js
index 5808310430..92c6ddf937 100644
--- a/public/src/modules/composer.js
+++ b/public/src/modules/composer.js
@@ -149,9 +149,13 @@ define(['taskbar'], function(taskbar) {
 			$(bodyEl).autocomplete({
 				source: function(request, response) {
 					var term = request.term;
-					var lastMention = request.term.lastIndexOf('@');
+
+					var cursorPosition = $(bodyEl).getCursorPosition();
+					term = term.substr(0, cursorPosition);
+
+					var lastMention = term.lastIndexOf('@');
 					if(lastMention !== -1) {
-						term = request.term.substr(lastMention);
+						term = term.substr(lastMention);
 					}
 
 					var userslugs = getUniqueUserslugs();
@@ -162,18 +166,22 @@ define(['taskbar'], function(taskbar) {
 					response(userslugs);
 					$('.ui-autocomplete a').attr('href', '#');
 				},
-				response: function(event, ui) {
-					var content = $(bodyEl).val();
-					var lastIndex = content.lastIndexOf('@');
-					if(content === '@') {
-						content = '';
-					} else if(lastIndex !== -1) {
-						content = content.substr(0, lastIndex);
-					}
+				focus: function(event, ui) {
+					return false;
+				},
+				select: function(event, ui) {
+					var cursorPosition = $(bodyEl).getCursorPosition();
+					var upToCursor = $(bodyEl).val().substr(0, cursorPosition);
+					var index = upToCursor.lastIndexOf('@');
+
+					if(index !== -1) {
+						var firstPart = $(bodyEl).val().substr(0, index);
+						var lastPart = $(bodyEl).val().substr(cursorPosition);
 
-					for(var i=0; i<ui.content.length; ++i) {
-						ui.content[i].value = content + ui.content[i].value;
+						$(bodyEl).val(firstPart + ui.item.value + lastPart);
+						$(bodyEl).selectRange(index + ui.item.value.length);
 					}
+					return false;
 				},
 				position: { my : "left bottom", at: "left bottom" }
 			});
diff --git a/public/src/utils.js b/public/src/utils.js
index 6eea61113d..67a5aed47d 100644
--- a/public/src/utils.js
+++ b/public/src/utils.js
@@ -187,6 +187,40 @@
 
 	if ('undefined' !== typeof window) {
 		window.utils = module.exports;
+
+		(function ($, undefined) {
+			$.fn.getCursorPosition = function() {
+				var el = $(this).get(0);
+				var pos = 0;
+				if('selectionStart' in el) {
+					pos = el.selectionStart;
+				} else if('selection' in document) {
+					el.focus();
+					var Sel = document.selection.createRange();
+					var SelLength = document.selection.createRange().text.length;
+					Sel.moveStart('character', -el.value.length);
+					pos = Sel.text.length - SelLength;
+				}
+				return pos;
+			}
+
+			$.fn.selectRange = function(start, end) {
+				if(!end) end = start;
+				return this.each(function() {
+					if (this.setSelectionRange) {
+						this.focus();
+						this.setSelectionRange(start, end);
+					} else if (this.createTextRange) {
+						var range = this.createTextRange();
+						range.collapse(true);
+						range.moveEnd('character', end);
+						range.moveStart('character', start);
+						range.select();
+					}
+				});
+			};
+
+		})(jQuery);
 	}
 
 })('undefined' === typeof module ? {