diff options
-rw-r--r-- | js/lib/autocomplete.js | 31 | ||||
-rw-r--r-- | views/default/css/elements/forms.php | 5 |
2 files changed, 27 insertions, 9 deletions
diff --git a/js/lib/autocomplete.js b/js/lib/autocomplete.js index 917326d4f..748070eaa 100644 --- a/js/lib/autocomplete.js +++ b/js/lib/autocomplete.js @@ -5,18 +5,35 @@ elgg.provide('elgg.autocomplete'); elgg.autocomplete.init = function() { $('.elgg-input-autocomplete').autocomplete({ - source: elgg.autocomplete.url, //gets set by input/autocomplete + source: function( request, response ) { + $.ajax({ + url: elgg.autocomplete.url, //gets set by input/autocomplete + dataType: "json", + data: { + q: request.term + }, + success: function( data ) { + response( $.map( data, function( item ) { + item.value = item.name; + return item; + })); + } + }) + }, minLength: 1, select: function(event, ui) { var item = ui.item; - $(this).val(item.name); - - var hidden = $(this).next(); + item.value = item.name; + + if($(this).next().attr('type') == "hidden"){ + var hidden = $(this).next(); + } else { + var hidden = $(this).after('<input type="hidden" name="'+this.name+'[]" />').next(); + } hidden.val(item.guid); } }) - //@todo This seems convoluted .data("autocomplete")._renderItem = function(ul, item) { switch (item.type) { case 'user': @@ -31,9 +48,9 @@ elgg.autocomplete.init = function() { return $("<li/>") .data("item.autocomplete", item) - .append(r) + .append('<a>'+r+'</a>') .appendTo(ul); }; }; -elgg.register_hook_handler('init', 'system', elgg.autocomplete.init);
\ No newline at end of file +elgg.register_hook_handler('init', 'system', elgg.autocomplete.init); diff --git a/views/default/css/elements/forms.php b/views/default/css/elements/forms.php index e5ffb8af2..0b88c6bda 100644 --- a/views/default/css/elements/forms.php +++ b/views/default/css/elements/forms.php @@ -352,7 +352,7 @@ input[type="radio"] { margin: 0; } -.ui-autocomplete li { +.ui-autocomplete li a { margin: 0px; padding: 2px 5px; cursor: default; @@ -380,9 +380,10 @@ input[type="radio"] { background-color: #eee; } -.ui-autocomplete li:hover { +.ui-autocomplete .ui-state-hover { background-color: #4690D6; color: white; + text-decoration: none; } .ui-autocomplete strong { |