Bind typehead to contact too

app/assets/javascripts/app.js.coffee

@@ -1,20 +1,9 @@
-registrarSource = new Bloodhound(
-  datumTokenizer: (d) ->
-    Bloodhound.tokenizers.whitespace d.display_key
+Autocomplete.bindTypeahead
+  remote: '/admin/registrars/search'
+  selector: '.js-registrar-typeahead'
+  hiddenSelector: '.js-registrar-id'
 
-  queryTokenizer: Bloodhound.tokenizers.whitespace
-  remote: "/admin/registrars/search?q=%QUERY"
-)
-
-registrarSource.initialize()
-$(".js-registrars-typeahead").typeahead(
-  highlight: true,
-  hint: false
-,
-  displayKey: "display_key"
-  source: registrarSource.ttAdapter()
-).on('typeahead:selected', (e, obj) ->
-  $('input[name="domain[registrar_id]"]').val obj.id
-  $('.js-registrar-selected').removeClass('hidden')
-  $('.js-registrar-unselected').addClass('hidden')
-)
+Autocomplete.bindTypeahead
+  remote: '/admin/contacts/search'
+  selector: '.js-contact-typeahead'
+  hiddenSelector: '.js-contact-id'

app/assets/javascripts/application.js.coffee

@@ -5,7 +5,8 @@
 #= require nprogress
 #= require nprogress-turbolinks
 #= require typeahead.bundle.min
-#= require_tree .
+#= require autocomplete
+#= require app
 
 NProgress.configure
   showSpinner: false

app/assets/javascripts/autocomplete.js.coffee

@@ -0,0 +1,29 @@
+class @Autocomplete
+  @bindTypeahead: (obj) ->
+    $(obj.selector).typeahead(
+      highlight: true,
+      hint: false
+    ,
+      displayKey: "display_key"
+      source: Autocomplete.constructSourceAdapter(obj.remote)
+    ).on('typeahead:selected', (e, item) ->
+      $(obj.hiddenSelector).val item.id
+
+      ok = $(obj.hiddenSelector).parent('div.has-feedback').find('.js-typeahead-ok')
+      remove = $(obj.hiddenSelector).parents('div.has-feedback').find('.js-typeahead-remove')
+
+      ok.removeClass('hidden')
+      remove.addClass('hidden')
+    )
+
+  @constructSourceAdapter: (remote) ->
+    source = new Bloodhound(
+      datumTokenizer: (d) ->
+        Bloodhound.tokenizers.whitespace d.display_key
+
+      queryTokenizer: Bloodhound.tokenizers.whitespace
+      remote: "#{remote}?q=%QUERY"
+    )
+
+    source.initialize()
+    source.ttAdapter()