无法弄清楚如何使用JQuery filter()方法和rails根据所选状态的ID过滤城市。已经看过Railscasts#88定期和修订,但我没有使用optgroup,所以他推荐的做法不起作用。我正在寻找的是放在下面的filter()方法调用中的内容。我怀疑它应该是这样的:
.filter("select label='job_state_id' "))
无论如何,这是JQuery:
$(document).ready(function(){
// grab all cities for later filtering
cities = $('#job_city_id').html();
$('#job_state_id').change(function(){
state = $('#job_state_id option:selected').text();
// can't figure out how to only display cities of the selected state, hence filter() is blank below
options = $(cities).filter().text();
$('#job_city_id').html(options);
});
});
Rails模型
class Job < ActiveRecord::Base
belongs_to :state
belongs_to :city
class State < ActiveRecord::Base
has_many :citys
has_many :jobs
class City < ActiveRecord::Base
belongs_to :state
has_many :jobs
Rails表单
<div class="field" >
<%= f.label :state_id %>
<%= f.collection_select :state_id, State.all, :id, :name, {:prompt => '-- Select a US State --'} %>
</div>
<div class="field">
<%= f.label :city_id %>
<%= f.collection_select :city_id, City.all, :id, :name, {:prompt => '-- Select a US City --'} %>
和HTML
<div class="field" >
<label for="job_state_id">State</label>
<select name="job[state_id]" id="job_state_id"><option value="">-- Select a US State --</option>
<option value="1">California</option>
<option value="2">Nevada</option>
<option value="3">Oregon</option>
<option value="4">Alaska</option></select>
</div>
<div class="field">
<label for="job_city_id">City</label>
<select name="job[city_id]" id="job_city_id"><option value="">-- Select a US City --</option>
<option value="1">Los Angeles</option>
<option value="2">San Francisco</option>
<option value="3">Portland</option></select>
</div>
非常感谢任何正确方向的帮助!
丹
答案 0 :(得分:1)
您在视图中没有足够的信息,因为它目前能够做您想做的事情......视图中没有任何内容可用于推断“洛杉矶”在“加利福尼亚”中。
您可以通过ajax调用执行此操作...当#job_state_id
更改向rails应用程序发送请求时,rails应用程序将返回新的选项列表。
或者你可以创建一个带有多个内部div的隐藏div,包含按州id分组的每个城市选项(每个div),然后复制与所选状态相关的div的html ......
<div style=style="display: none;">
<% current_state_id = nil %>
<% City.order_by(:state_id).each do |city| %>
<% if city.state_id != current_state_id %>
<% if current_state_id %>
</div>
<% end %>
<% current_state_id = city.state_id %>
<div id='<%=current_state_id %>'>
< % end %>
<option value="<%= city.id %>"><%=city.name%></option>
<% end %>
<% if current_state_id %>
</div>
<% end %>
</div>
然后在你的代码中进行状态更改时...
var state = $('#job_state_id option:selected').val();
$('#job_city_id').html($('#' + state).html());