From ccb4af1977dd895b3b0528928c02788bcb80cae1 Mon Sep 17 00:00:00 2001 From: Francesco Locunto Date: Mon, 28 Sep 2015 12:27:44 +0200 Subject: [PATCH 1/2] Added the 'cursorDropdown' option to let the autocompletion dropdown to appear under the input cursor and not under the textbox. Defaults to false (standard behaviour). --- src/jquery.tokeninput.js | 14 ++++++++++++-- 1 file changed, 12 insertions(+), 2 deletions(-) diff --git a/src/jquery.tokeninput.js b/src/jquery.tokeninput.js index 4b69d823..5167d157 100755 --- a/src/jquery.tokeninput.js +++ b/src/jquery.tokeninput.js @@ -33,6 +33,7 @@ placeholder: null, theme: null, zindex: 999, + cursorDropdown: false, resultsLimit: null, enableHTML: false, @@ -798,11 +799,20 @@ } function show_dropdown() { + var top, left; + + top = $(input).data("settings").cursorDropdown ? + input_box.offset().top + input_box.outerHeight(true) : + token_list.offset().top + token_list.outerHeight(true); + left = $(input).data("settings").cursorDropdown ? + input_box.offset().left : + token_list.offset().left; + dropdown .css({ position: "absolute", - top: token_list.offset().top + token_list.outerHeight(true), - left: token_list.offset().left, + top: top, + left: left, width: token_list.width(), 'z-index': $(input).data("settings").zindex }) From 6b73e075388fbac1fbd38332e1ac7dc955847dc5 Mon Sep 17 00:00:00 2001 From: Francesco Locunto Date: Mon, 28 Sep 2015 12:32:47 +0200 Subject: [PATCH 2/2] Added the 'width' option to let the user have a chance to define the autocompletion dropdown width. If not set, defaults to textbox width (standard behaviour). --- src/jquery.tokeninput.js | 9 +++++++-- 1 file changed, 7 insertions(+), 2 deletions(-) diff --git a/src/jquery.tokeninput.js b/src/jquery.tokeninput.js index 5167d157..d0ae15ef 100755 --- a/src/jquery.tokeninput.js +++ b/src/jquery.tokeninput.js @@ -32,6 +32,7 @@ animateDropdown: true, placeholder: null, theme: null, + width: null, zindex: 999, cursorDropdown: false, resultsLimit: null, @@ -799,7 +800,7 @@ } function show_dropdown() { - var top, left; + var top, left, width; top = $(input).data("settings").cursorDropdown ? input_box.offset().top + input_box.outerHeight(true) : @@ -807,13 +808,17 @@ left = $(input).data("settings").cursorDropdown ? input_box.offset().left : token_list.offset().left; + width = $(input).data("settings").width; + if (!width) { + width = token_list.width(); + } dropdown .css({ position: "absolute", top: top, left: left, - width: token_list.width(), + width: width, 'z-index': $(input).data("settings").zindex }) .show();