select2 AJAX'd to a model, configuration - ruby-on-rails

Question

So, I just discovered select2. Awesome. Now I'm trying to figure out how to use it, server side with ajax / json. All of the examples I see, everywhere, show using select2 with JSONP to retrieve data from an external source. I feel like this should be even easier if calling from a local model, no? I'll get right to the nitty gritty. json returns a value, but the searchbox doesn't autocomplete, it stays blank.
view html:
<%= form_tag request_pal_path, remote: true do %>
<%= hidden_field_tag :email, nil, class: 'ui-corner-all' %>
<%= submit_tag "Send request", class: 'button' %>
<% end %>
and calling some js on it:
$(document).ready(function() {
$("#find_user #email").select2({
width: '400px',
placeholder: "Find user...",
minimumInputLength: 1,
multiple: false,
id: function(obj) {
return obj.id; // use slug field for id
},
ajax: { // instead of writing the function to execute the request we use Select2's convenient helper
url: "/users",
dataType: 'json',
data: function (term, page) {
return {
q: term, // search term
page_limit: 10
};
},
results: function (data, page) { // parse the results into the format expected by Select2.
// since we are using custom formatting functions we do not need to alter remote JSON data
return {results: data};
}
},
formatResult: FormatResult,
formatSelection: FormatSelection,
escapeMarkup: function (m) { return m; }
});
})
function FormatResult(user) {
return '<div>' + user.name + '</div>';
}
function FormatSelection(user) {
return user.name;
}
which goes to the controller, user index action:
def index
#find = User.where('name LIKE ?', "%#{params[:q]}%")
#users = #find.where('id NOT IN (?)', current_user.id).order('random()').page(params[:page]).per(100)
#title = "Potential pals"
respond_to do |format|
format.html
format.js {
#find = #find
#users = #users
}
format.json { #find }
end
end
and I made a .json file for it to respond to (not sure if this is even necessary):
<% #find.each do |user| %>
<%= user.name %>
<% end %>
So, the json is working, to an extent. If I look in the developer console, it shows a response coming from http://localhost:3000/users.json?q=tay, or whereever, and it returns a single value, for Taylor (in that instance). But when I search inside of the select2 search box, it just spins and spins, with no results. No console errors, so that's nice, ha. Thoughts? Thanks!

Answer 1

The select2 plugin expects JSON data in the following format:
[ { "text": "Taylor", "id": 1 }, { "text" : "Tailor", "id": 2 }, ...]
So you need to replace name with text in your user model when converting to JSON:
def as_json(*args)
super.tap { |hash| hash["text"] = hash.delete "name" }
end
and then in the index method:
def index
#find = User.where('name LIKE ?', "%#{params[:q]}%")
#users = #find.where('id NOT IN (?)', current_user.id).order('random()').page(params[:page]).per(100)
#title = "Potential pals"
respond_to do |format|
format.html
format.js {
#find = #find
#users = #users
}
format.json { render json: #find, :only => [:text, :id] } # might be :name here ?
end
end
and you don't need the view for JSON.

Answer 2

I guess the problem is in your .json file, since select2 needs json array or json object. Try to remove it and respond with format.json { render json: #find.to_json }. Other code seems ok to me.