Cont Preenchendo ComboBox Com Cidades De Acordo Com O Estado Selecionado Em Rails

Seguindo esse meu post e para tirar a duvida do Romulo e Tiago no grupo rails-br, resolvi ir um pouco mais longe sobre o post de preencher combobox de acordo com o estado selecionado.

Vamos as seguintes alterações:

1) Sigua esse post, pois vamos verificar o terminal para saber como esta sendo passado o parametro state_id;

2) Veja que ao abrir a url do sistema e modificar o estado e cidade os mesmos não se mantem na página ao pressionar o botão de criar ou atualizar;

3) Adicione: attr_accessor :state_id no model User e em seguida faça a seguinte mudança na partial form de User:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
###### Antes
  <div class="field">
    <%= f.label :state %><br />
    <%= collection_select(:state ,:id, State.all, :id, :name, :include_blank => 'SELECT A STATE') %>
  </div>
    $(document).ready(function() {
   $("#state_id").change(function() {
      getCitiesByState("id="+$("#state_id").val());
    });
 });

 ##### Depois
   <div class="field">
    <%= f.label :state %><br />
    <%= f.collection_select :state_id, State.all, :id, :name, :selected => @user.state_id, :include_blank => 'SELECT A STATE' %>
  </div>
    $(document).ready(function() {
   $("#user_state_id").change(function() {
      getCitiesByState("id="+$("#user_state_id").val());
    });
 });

Com essas modificações podemos observar que agora o estado se mantem ao selecionar um no combobox, mas a cidade não. Veja que foi adicionado um parametro no collection, então essa sera uma das soluções para o caso cidade, vamos la. Criamos um helper e logo em seguida alteramos o form com o seguinte código:

1
2
3
4
5
6
7
8
9
10
11
12
13
###helper
  def cities(state)
      City.where("state_id = ?", state)
  end
###form
  <div class="field">
    <%= f.label :city %><br />
    <% if @user.state_id.present? %>
      <%= f.collection_select :city_id, cities(@user.state_id), :id, :name, :selected => @user.city_id, :include_blank => 'SELECT A CITY'%>
    <% else %>
      <%= f.collection_select :city_id, [], :id, :name, :selected => @user.city_id, :include_blank => 'SELECT FIRST STATE' %>
    <% end %>
  </div>

Essa opção :selected fará com que ao abrir a página se existir a cidade ela venha selecionada no combobox. Com isso concluimos a parte de cadastro.

Agora podemos verificar que na parte de edição nada aparece, então ja que sabemos para que serve o :selected vamos as modificaçãoes:

1
2
3
4
5
6
7
8
9
  <div class="field">
    <%= f.label :state %><br />
    <%= f.collection_select :state_id, State.all, :id, :name, :selected => @user.city.present? ? @user.city.state_id : @user.state_id, :include_blank => 'SELECT A STATE' %>
  </div>

  <div class="field">
    <%= f.label :city %><br />
      <%= f.collection_select :city_id, cities(@user.city.present? ? @user.city.state_id : @user.state_id), :id, :name, :selected => @user.city_id, :include_blank => @user.city.present? || @user.state_id.present? ? 'SELECT A CITY' : 'SELECT FIRST STATE' %>
  </div>

Agora cabe a você fazer as modificações necessárias. O código esta no github. Simple e fácil lol.

Comments