當沒有模型時使用Rails jQuery自動完成

Question

jQuery自動完成文檔狀態應該有兩個模型，第一個是您想用於自動完成的模型，第二個是具有模型的第一個Model（並且是附加到您的頁面）。但是，我沒有第二個模型，只有一個帶有表單元素的控制器，其中一個是第一個模型（Venue）的自動完成輸入。

文檔說我應該做的

resources :parse do 
get :autocomplete_venue_name, :on => :collection 
end 

但由於控制器「解析」沒有一種模式是行不通的。我嘗試了一個靜態路由，但我需要：收集選項。我該如何解決這個需求？

編輯： 以下是rails + jquery自動完成插件的代碼。請注意，我有一個ProductsController的，但我沒有一個產品模型，所以我不能做的routes.rb設置：

類品牌<的ActiveRecord :: Base的 結束

模型要搜索：

create_table :brand do |t| 
    t.column :name, :string 
    end 

以期望AUTOCOMPLETE表單控制器：

class ProductsController < Admin::BaseController 
    autocomplete :brand, :name 
end 

的routes.rb

resources :products do 
    get :autocomplete_brand_name, :on => :collection 
end 

這種方法只適用於我有產品模型，我不這樣做。我有一個控制器顯示帶有自動完成輸入的表單。

Answer 1

我使用jQuery多自動完成插件，您可以在其中選擇一個或多個自動

完整的值，如果沒有模型，那麼它會工作如

$（文件）。就緒（函數（）{

 var availableTags = []; 
    <%@tags.each do |tag|%> 
     availableTags.push('<%=tag.name%>'); 
    <%end%> 

    $('#tags').multicomplete({ 
     source: availableTags 
    }); 

}); 

在我的情況

@tags = Tag.all

但你可以給控制器action.Whose模型中的任何其他值是不存在

像控制器

@tags = [ 「可愛」， 「美」， 「驚人」]

我使用多自動填充的代碼如下。

(function($, $a, $p) { // getting $p as a parameter doesn't require me to "var $p=..." and saves a two bytes ;-) ("var " versus ",x" in argument list [when minifier is shrinking variables]) 
    $p = $a.prototype; 
    $.widget('ui.multicomplete', $a, { 
     // Search for everything after the last "," instead of the whole input contents 
     _search: function(value) { 
      $p._search.call(this, value.match(/\s*([^,]*)\s*$/)[1]); 
     }, 
     // Overwrite _trigger to make custom handling for events while still allowing user callbacks 
     // Setting my own callbacks on this.options or binding using .bind() doesn't allow me to properly handle user callbacks, as this must be called AFTER the user callbacks are executed (which isn't possible by bind()ing when this.options[] is set) 
     _trigger: function(type, event, data) { 
      // call "real" triggers 
      var ret = $p._trigger.apply(this, arguments); 
      // When its select event, and user callback didn't return FALSE, do my handling and return false 
      if (type == 'select' && ret !== false) { 
       // When a selection is made, replace everything after the last "," with the selection instead of replacing everything 
       var val = this.element.val(); 
       this.element.val(val.replace(/[^,]+$/, (val.indexOf(',') != -1 ? ' ' : '') + data.item.value + ', ')); 
       ret = false; 
      } 
      // Force false when its the focus event - parent should never set the value on focus 
      return (type == 'focus' ? false : ret); 
     }, 
     _create:function() { 
      var self = this; 
      // When menu item is selected and TAB is pressed focus should remain on current element to allow adding more values 
      this.element.keydown(function(e) { 
       self.menu.active && e.keyCode == $.ui.keyCode.TAB && e.preventDefault(); 
      }); 
      $p._create.call(this); 
     }, 
     _initSource: function() { 
      // Change the way arrays are handled by making autocomplete think the user sent his own source callback instead of an array 
      // The way autocomplete is written doesn't allow me to do it in a prettier way :(
      if ($.isArray(this.options.source)) { 
       var array = this.options.source, self = this; 
       this.options.source = function(request, response) { 
        response(self.filter(array, request)); // Use our filter() and pass the entire request object so the filter can tell what's currently selected 
       }; 
      } 

      // call autocomplete._initSource to create this.source function according to user input 
      $p._initSource.call(this); 

      // Save a copy of current source() function, than new source() sets request.selected and delegate to original source 
      var _source = this.source; 
      this.source = function(request, response) { 
       request.selected = this.element.val().split(/\s*,\s*/); 
       request.selected.pop(); // don't include the term the user is currently writing as selected 
       _source(request, response); 
      }; 
      // TODO: instead of overwritting this.source, I can overwrite _search which is easier, but than I'll have to repeat jQuery-UI's code that might change 
     }, 

     // Like $.ui.autocomplete.filter, but excludes items that are already selected 
     filter: function(array, request) { 
      return $.grep($a.filter(array, request.term), function(value) { 
       return $.inArray(value, request.selected) == -1; 
      }); 
     } 
    }); 
})(jQuery, jQuery.ui.autocomplete); 

但你應該包括jquery.UI.Download文件從那裏一些jQuery的自動完成js文件，包括項目。

jquery.ui.core

jquery.ui.widget

jquery.ui。

jquery.ui.autocomplete