Commit 3f753719 authored by Jacob Schatz's avatar Jacob Schatz Committed by Robert Speicher

Merge branch 'ref-dropdown-jquery-objects' into 'master'

Use jQuery objects in ref dropdown

## What does this MR do?

Keeps the behaviour the same as the ref dropdown, however it now uses jQuery objects to handle the HTML creation instead of passing strings around. It pretty much worked out the box so not much was changed in the dropdowns themselves. Will be easy to transfer this over to other dropdown menus as well.

cc. @jschatz1 @rspeicher @DouweM 

Do we want this to go into a patch release?

See merge request !4850
parent 066ea4bd
...@@ -280,7 +280,7 @@ class GitLabDropdown ...@@ -280,7 +280,7 @@ class GitLabDropdown
html = @renderData(data) html = @renderData(data)
# Render the full menu # Render the full menu
full_html = @renderMenu(html.join("")) full_html = @renderMenu(html)
@appendMenu(full_html) @appendMenu(full_html)
...@@ -351,7 +351,8 @@ class GitLabDropdown ...@@ -351,7 +351,8 @@ class GitLabDropdown
if @options.renderMenu if @options.renderMenu
menu_html = @options.renderMenu(html) menu_html = @options.renderMenu(html)
else else
menu_html = "<ul>#{html}</ul>" menu_html = $('<ul />')
.append(html)
return menu_html return menu_html
...@@ -360,7 +361,9 @@ class GitLabDropdown ...@@ -360,7 +361,9 @@ class GitLabDropdown
selector = '.dropdown-content' selector = '.dropdown-content'
if @dropdown.find(".dropdown-toggle-page").length if @dropdown.find(".dropdown-toggle-page").length
selector = ".dropdown-page-one .dropdown-content" selector = ".dropdown-page-one .dropdown-content"
$(selector, @dropdown).html html $(selector, @dropdown)
.empty()
.append(html)
# Render the row # Render the row
renderItem: (data, group = false, index = false) -> renderItem: (data, group = false, index = false) ->
......
...@@ -70,17 +70,20 @@ class @Project ...@@ -70,17 +70,20 @@ class @Project
fieldName: 'ref' fieldName: 'ref'
renderRow: (ref) -> renderRow: (ref) ->
if ref.header? if ref.header?
"<li class='dropdown-header'>#{ref.header}</li>" $('<li />')
.addClass('dropdown-header')
.text(ref.header)
else else
isActiveClass = if ref is selected then 'is-active' else '' link = $('<a />')
.attr('href', '#')
"<li> .addClass(if ref is selected then 'is-active' else '')
<a href='#' data-ref='#{escape(ref)}' class='#{isActiveClass}'> .text(ref)
#{ref} .attr('data-ref', escape(ref))
</a>
</li>" $('<li />')
.append(link)
id: (obj, $el) -> id: (obj, $el) ->
$el.data('ref') $el.attr('data-ref')
toggleLabel: (obj, $el) -> toggleLabel: (obj, $el) ->
$el.text().trim() $el.text().trim()
clicked: (e) -> clicked: (e) ->
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment