在內部服務器500與AJAX軸的錯誤

我想使一個文本框，顯示按每個鍵入的字母排序的排序用戶列表。從那裏人可以將用戶添加爲協作者。當你在尋找新朋友的時候，結果應該就像Facebook的搜索功能一樣。當我按下某個鍵時，我在瀏覽器控制檯的網絡部分看到新的500內部服務器錯誤。下面是響應的一個片段：在內部服務器500與AJAX軸的錯誤

<h1> 
    NoMethodError 
     in CollaborationsController#collaboration_search 
    </h1> 
</header> 

<div id="container"> 
    <h2>undefined method `[]&#39; for nil:NilClass</h2>

所以我覺得Ajax是被炒到服務器，但也有一些是錯誤的控制器。這裏是我的視圖，視圖/協作/ _new.html.erb代碼：

<%= form_for [wiki, collaboration] do |f|%> 

<div class = "col-md-8"> 

    <div class = "form-group"> 
     <%= f.label :user_name %> 
     <%= f.text_field :user_name, class: 'form-control', placeholder: "Enter name" %> 

    </div> 
    <div class = "form-group"> 
     <%= f.submit class: 'btn btn-success' %> 
    </div> 
    </div> 
    <%= @users_by_name.to_a %> 
</div> 

    </div> 

</div> 
<%end%>

其中上面的表單是部分。 AJAX的被寫入的javascripts/collaborations.js： $（文件）。就緒（函數（） { //警報（1）;

$('#collaboration_user_name').on('keyup', function() { 

     // text = $(this).val(); 
     // alert(text); 

     $.ajax({ url: "/collaborations", 
     beforeSend: function(xhr) { 
     xhr.overrideMimeType("text/plain; charset=x-user-defined"); 
     } 
    }).done(function(data) { 
     if(console && console.log) { 
     console.log("Sample of data:", data.slice(0, 100)); 
     //alert() 

     } 
    }); 
}); 
});

這裏是協作控制器內的協作＃search_collaboration動作：

def collaboration_search 
    name_search = params[:collaboration][:user_name].to_s 
    @users_by_name = User.where('name Like ?', "%#{params[:collaboration][:user_name]}%") 
    render json: @users_by_name.map do |user| 
    { name: user.name, id: user.id} 
    end

末

而只是爲了測試目的我一直在我的合作/ search_collaboration.js.erb很簡單：

alert('hello');

但是，如果有人能指出我正確的方向，以便如何列出從collaboration_search操作返回的用戶名稱，我們將非常感謝！

來源

2014-09-20 user3266824

您試圖構建的UX Jargon是自動完成下拉列表或自動完成組合框。它實際上是一個相當複雜的UI元素，我不會從頭開始編程。你應該使用像JQuery這樣的庫。 JQuery內置於核心Rails，所以我只需要包含正確的庫。這是來自JQuery的元素示例。

http://jquery-ui.googlecode.com/svn/tags/1.8.7/demos/autocomplete/combobox.html

你可以看一下源代碼使用瀏覽器的開發工具

這裏是JQuery的自動完成文檔

http://jqueryui.com/autocomplete/

你可以看一下代碼在你

這是另一個實施 http://www.jqwidgets.com/jquery-widgets-demo/demos/jqxcombobox/index.htm

來源

2014-09-20 19:17:16

這不是一個答案。它只是關於'jQuery'庫的鏈接。 – 2014-09-20 19:23:33

自學自動完成路線是學習的有用練習，但要注意讓所有用戶都可以使用它（例如依賴屏幕閱讀器的用戶），這是一項相當大的工作。如果您按照建議或其他方式選擇第三方小部件，例如曾使用Twitter Bootstrap發佈的[Typeahead.js]（http://twitter.github.io/typeahead.js/），希望可訪問性詳細信息已被注意的。此外，至少應該瞭解HTML5的datalist元素（可惜[在所有瀏覽器中都不支持]（http://beta.caniuse.com/#search=datalist））。 – 2014-09-21 10:57:14

錯誤似乎表明，你想索引到的東西作爲一個哈希表，它是，事實上，零：

undefined method `[]&#39; for nil:NilClass

的[]指的是哈希索引 - 如params[:collaboration] 。我當時的猜測是，你沒有以預期的格式爲控制器操作提供參數，所以params[:collaboration]是nil，並且你試圖索引到params[:collaboration][:user_name]，引發了所述錯誤。

這與你當前的jQuery代碼一起玩，它根本不發送數據（你在哪裏發送text作爲參數，在查詢字符串中或作爲jQuery.ajax（）參數？），更不用說了以那種特定的格式。

你既可以做這樣的事情：

$.ajax({ url: "/collaborations?collaboration=#{text}", 
    #..etc

或者你可以使用ajax功能的數據的方法，給它一個參數作爲一個散列，而不是僅僅把它扔在URL中。該功能的文檔應該爲您提供更多信息。

我強烈建議後者，因爲你期望嵌套散列在你的控制器[:collaboration][:user_name]，這是不容易在查詢字符串參數支持。

要查看的參數來作爲，我建議拋出這樣的事情在你的Ruby控制器：

puts "PARAMS: #{params.inspect}"

這應該高於一切導致錯誤。它會打印出你服務器日誌中的參數（你輸入rails server或rails s的終端標籤），這樣你就可以看到參數是什麼，這個假設是否準確，以及如何解決這個問題。

作爲最後一點，我不認爲你實際上擊中了.js.erb文件。你的動作只是返回一個對jQuery ajax函數的響應。該響應位於done()處的函數中，響應數據在您當前的代碼中稱爲data。一旦你通過這個錯誤，我會提醒你data，看看你的控制器是如何序列化的。然後，如果沒有那個js.erb文件，您可以簡單地使用jQuery的結果更新DOM。

（最後說明，我想不出你需要測試if console && console.log的場合，我不確定測試是否會引發錯誤，但我可能是錯的）

來源

2014-09-20 20:01:03 Sasha

在內部服務器500與AJAX軸的錯誤

回答

相關問題