CODEWITHSUNDEEP
ruby-on-railsrubyajaxruby-on-rails-4
Nidhin S G
Nidhin S G

Reputation: 1695

respond to do format Issue

I have 2 Fields like State and Cities. Cities are to be loaded with respect to the corresponding State. And my fields are not purely DropDown. They are like an input field with autocomplete which allows us to select multiple options(refer images..)

screenshot1

screenshot2

This is how I load my states.

<%= jl.select :state_id,  State.all.map{|j| [j[:name], j[:id]]}, {}, {class: 'select2', multiple: true, 'data-placeholder' => 'Type State to Search'} %>

And to load cities I have written jquery which sent an ajax request and then append the response in its success function.

And my controller is like

def update_city_select
    @states = State.where(name: params[:name]).order(:id) unless params[:name].blank?    
    @cities = City.where(state_id: @states.first.id).order(:name) unless @states.first.id.blank?
    respond_to do |format|
      format.html { render layout: false }
      format.js
      format.xml
    end
  end

And my update_city_select.html.erb is like 

<%= select_tag 'city_id', options_from_collection_for_select(@cities, "id", "name", @states), {}, {class: 'select2', multiple: true, 'data-placeholder' => 'Type City to Search'} %>

Thing is I always gets an error in my terminal.. 

(wrong number of arguments (4 for 1..3)):
    1: <%= select_tag 'city_id', options_from_collection_for_select(@cities, "id", "name", @states), {}, {class: 'select2', multiple: true, 'data-placeholder' => 'Type State to Search'} %>

And if I remove {} form update_city_html page it would work fine. But all I get is a simple dropdown list without that input field like alabama california in my 1st image. Is there any way I can solve this.

Upvotes: 3

Views: 172

Answers (2)

Richard Peck
Richard Peck

Reputation: 76784

I think your problem is to do with how you're rendering your form, not the respond_to block in Rails. I see you're using select2:

select_tag

It's my belief that your select_tag is not being called correctly. This is irrespective of whether you're calling the right content-type from respond_to

This may seem obvious, but the fact is you're calling select_tag independently of your form, and consequently this will be the cause of the issue

options_from_collection_for_select

Admittedly, I don't have any experience with select2, but I've been looking, and I think your problem might be to do with your options_from_collection_for_select, as well as your {}:

<%= select_tag 'city_id', options_from_collection_for_select(@cities, "id", "name", @states), {}, {class: 'select2', multiple: true, 'data-placeholder' => 'Type State to Search'} %>

I would test passing only id's to the last argument of options_from_collection_for_select (to see if your sending whole objects will be an issue for Rails)

select

As mentioned by Paul the octopus, your calling of select_tag basically means you only have 3 arguments to work with, whereas f.select has 4:

select_tag(name, option_tags = nil, options = {})

select(object, method, choices, options = {}, html_options = {})

The surface-level fix will be to use a form_builder object with your new select tag, instead of a naked select_tag:

#update_city_select.html.erb 
<%= form_for @instace_var_for_form do |jl| %>
    <%= jl.select :city,  options_from_collection_for_select(@cities, "id", "name", @states), {}, {class: 'select2', multiple: true, 'data-placeholder' => 'Type State to Search'} %>
<% end %>

#ajax
$(document).on("ajax:success", "select", function(data) {
    //pull select form form
    $("element").append(select);
});

Upvotes: 1

cristian
cristian

Reputation: 8744

select_tag accepts only 3 arguments. Have a look at its definition. So leave it as 

`select_tag 'city_id', options_from_collection_for_select(@cities, "id", "name", @states), {class: 'select2', multiple: true, 'data-placeholder' => 'Type City to Search'}`

Be sure to set the correct format for your ajax request (this should be jsonp)

$("#your_states_input_id").select2({
  placeholder: "Search for a city",
  ajax: { 
    url: "your_city_url_here",
    dataType: 'jsonp'
  }
});

For more info have a look at select2 ajax example

Upvotes: 0

Related Questions