Enter button trigger first row click when searching

This commit is contained in:
Phil Hughes 2016-03-08 16:53:31 +00:00
parent 57294f3043
commit 6c89196278
2 changed files with 30 additions and 11 deletions

View file

@ -1,12 +1,17 @@
class GitLabDropdownFilter class GitLabDropdownFilter
BLUR_KEYCODES = [27, 40] BLUR_KEYCODES = [27, 40]
constructor: (@dropdown, @remote, @query, @keys, @data, @callback) -> constructor: (@dropdown, @options) ->
@input = @dropdown.find(".dropdown-input .dropdown-input-field") @input = @dropdown.find(".dropdown-input .dropdown-input-field")
# Key events # Key events
timeout = "" timeout = ""
@input.on "keyup", (e) => @input.on "keyup", (e) =>
if e.keyCode is 13 && @input.val() isnt ""
if @options.enterCallback
@options.enterCallback()
return
clearTimeout timeout clearTimeout timeout
timeout = setTimeout => timeout = setTimeout =>
blur_field = @shouldBlur e.keyCode blur_field = @shouldBlur e.keyCode
@ -15,9 +20,9 @@ class GitLabDropdownFilter
if blur_field if blur_field
@input.blur() @input.blur()
if @remote if @options.remote
@query search_text, (data) => @options.query search_text, (data) =>
@callback(data) @options.callback(data)
else else
@filter search_text @filter search_text
, 250 , 250
@ -26,12 +31,12 @@ class GitLabDropdownFilter
return BLUR_KEYCODES.indexOf(keyCode) >= 0 return BLUR_KEYCODES.indexOf(keyCode) >= 0
filter: (search_text) -> filter: (search_text) ->
data = @data() data = @options.data()
results = data results = data
if search_text isnt "" if search_text isnt ""
results = fuzzaldrinPlus.filter(data, search_text, results = fuzzaldrinPlus.filter(data, search_text,
key: @keys key: @options.keys
) )
@callback results @callback results
@ -89,10 +94,16 @@ class GitLabDropdown
# Init filiterable # Init filiterable
if @options.filterable if @options.filterable
@filter = new GitLabDropdownFilter @dropdown, @options.filterRemote, @options.data, @options.search.fields, => @filter = new GitLabDropdownFilter @dropdown,
remote: @options.filterRemote
query: @options.data
keys: @options.search.fields
data: =>
return @fullData return @fullData
, (data) => callback: (data) =>
@parseData data @parseData data
enterCallback: =>
@selectFirstRow()
# Event listeners # Event listeners
@dropdown.on "shown.bs.dropdown", @opened @dropdown.on "shown.bs.dropdown", @opened
@ -234,6 +245,14 @@ class GitLabDropdown
input = "<input type='hidden' name='#{fieldName}' value='#{value}' />" input = "<input type='hidden' name='#{fieldName}' value='#{value}' />"
@dropdown.before input @dropdown.before input
selectFirstRow: ->
selector = '.dropdown-content li:first-child a'
if @dropdown.find(".dropdown-toggle-page").length
selector = ".dropdown-page-one .dropdown-content li:first-child a"
# similute a click on the first link
$(selector).trigger "click"
$.fn.glDropdown = (opts) -> $.fn.glDropdown = (opts) ->
return @.each -> return @.each ->
new GitLabDropdown @, opts new GitLabDropdown @, opts

View file

@ -65,7 +65,7 @@
position: absolute; position: absolute;
top: 100%; top: 100%;
left: 0; left: 0;
z-index: 9999; z-index: 9;
width: 240px; width: 240px;
margin-top: 2px; margin-top: 2px;
margin-bottom: 0; margin-bottom: 0;