Allow issue relation autocomplete to select multiple values (#33418).

Patch by Marius BALTEANU.


git-svn-id: http://svn.redmine.org/redmine/trunk@20690 e93f8b46-1217-0410-a6f0-8f06a7374b81

app/views/issue_relations/_form.html.erb

@@ -18,6 +18,6 @@
 <%= link_to_function l(:button_cancel), '$("#new-relation-form").hide();'%>
 </p>
 
-<%= javascript_tag "observeAutocompleteField('relation_issue_to_id', '#{escape_javascript auto_complete_issues_path(:project_id => @project, :scope => (Setting.cross_project_issue_relations? ? 'all' : nil), :issue_id => @issue.id)}')" %>
+<%= javascript_tag "multipleAutocompleteField('relation_issue_to_id', '#{escape_javascript auto_complete_issues_path(:project_id => @project, :scope => (Setting.cross_project_issue_relations? ? 'all' : nil), :issue_id => @issue.id)}')" %>
 
 <%= javascript_tag "setPredecessorFieldsVisibility();" %>

public/javascripts/application.js

@@ -617,6 +617,46 @@ function observeAutocompleteField(fieldId, url, options) {
   });
 }
 
+function multipleAutocompleteField(fieldId, url, options) {
+  function split(val) {
+    return val.split(/,\s*/);
+  }
+
+  function extractLast(term) {
+    return split(term).pop();
+  }
+
+  $(document).ready(function () {
+    $('#' + fieldId).autocomplete($.extend({
+      source: function (request, response) {
+        $.getJSON(url, {
+          term: extractLast(request.term)
+        }, response);
+      },
+      minLength: 2,
+      position: {collision: "flipfit"},
+      search: function () {
+        $('#' + fieldId).addClass('ajax-loading');
+      },
+      response: function () {
+        $('#' + fieldId).removeClass('ajax-loading');
+      },
+      select: function (event, ui) {
+        var terms = split(this.value);
+        // remove the current input
+        terms.pop();
+        // add the selected item
+        terms.push(ui.item.value);
+        // add placeholder to get the comma-and-space at the end
+        terms.push("");
+        this.value = terms.join(", ");
+        return false;
+      }
+    }, options));
+    $('#' + fieldId).addClass('autocomplete');
+  });
+}
+
 function observeSearchfield(fieldId, targetId, url) {
   $('#'+fieldId).each(function() {
     var $this = $(this);

test/system/issues_test.rb

@@ -540,4 +540,35 @@ class IssuesSystemTest < ApplicationSystemTestCase
     assert !page.has_css?('#trackers_description')
     assert_equal "2", page.find('select#issue_tracker_id').value
   end
+
+  def test_edit_should_allow_adding_multiple_relations_from_autocomplete
+    log_user('admin', 'admin')
+
+    visit '/issues/1'
+    page.find('#relations .contextual a').click
+    page.fill_in 'relation[issue_to_id]', :with => 'issue'
+
+    within('ul.ui-autocomplete') do
+      assert page.has_text? 'Bug #12: Closed issue on a locked version'
+      assert page.has_text? 'Bug #11: Closed issue on a closed version'
+
+      first('li.ui-menu-item').click
+    end
+    assert_equal '12, ', find('#relation_issue_to_id').value
+
+    find('#relation_issue_to_id').click.send_keys('issue due')
+    within('ul.ui-autocomplete') do
+      assert page.has_text? 'Bug #7: Issue due today'
+
+      find('li.ui-menu-item').click
+    end
+    assert_equal '12, 7, ', find('#relation_issue_to_id').value
+
+    find('#relations').click_button('Add')
+
+    within('#relations table.issues') do
+      assert page.has_text? 'Related to Bug #12'
+      assert page.has_text? 'Related to Bug #7'
+    end
+  end
 end