Question

对此可能有一个简单的解决方案，但是，我无法找到它。

我有一个简单的表格，我有状态选择框＆amp; site text_field：

_form.html.erb

<div class="field">
  <%= f.label :state, 'State' %><br>
  <%= f.select :state, [['NSW'], ['VIC'], ['SA'], ['WA'], ['QLD']] %>
</div>
<div class="form-group">
  <%= f.label :site, 'Site'%><br>
  <%= f.text_field :site %>
</div>

我真的希望能够选择＆＃34; VIC＆＃34; （澳大利亚的一个州）然后由于＆＃34; VIC＆＃34;如果选中，则：site text_field会自动填充另一个值，例如站点名称。

例如：＆＃34; VIC＆＃34;选择状态 - ＆gt; ＆＃34;墨尔本＆＃34;站点填写在表单上的text_field中（在：站点中）

我已经玩了一些我在网上找到的一些示例javascript，当在选择框中选择某个值时，它似乎会更新屏幕上的某些文字，但是，我似乎无法形成＆＃ 34;如果＆＃34;说明：如果＆＃34; VIC＆＃34;选中，然后使用＆＃34;墨尔本＆＃34;。

填充：site的text_field

提前致谢。

code for javascript that changes to the value selected:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js" type="text/javascript"></script>

<div id="text_to_be_changed"><%= @day_of_week %></div>
<%= select_tag :days, options_for_select(["Monday", "Tuesday"]), :id => "select_days" %>

<script>
$(document).ready(function(){
    $('#select_days').change(function() {
        $('#text_to_be_changed').html($(this).val());
    });
});
</script>

Answer 1

您需要javascript来“了解”“VIC”与“墨尔本”之间的关系，或更普遍地说是州与其首府城市之间的关系。这可以以各种方式存储，例如作为js代码中的数组或映射。例如

HTML：

<div class="field">
  <%= f.label :state, 'State' %><br>
  <%= f.select :state, [['NSW'], ['VIC'], ['SA'], ['WA'], ['QLD']], :id => "state-select" %>
</div>
<div class="form-group">
  <%= f.label :site, 'Site'%><br>
  <%= f.text_field :site, :id => "city-select" %>
</div>

JS：

$(document).ready(function(){
  var stateDefaultCities = {
    "VIC": "Melbourne", 
    "NSW": "Sydney",
    "WA": "Perth"
    //etc
  }
  $('#state-select').change(function() {
      $('#city-select').val(stateDefaultCities[$(this).val]);
  });
});

编辑：这个解决方案有点脆弱，因为状态在标记和html中重复出现：例如，如果要向选择添加选项，则需要向stateDefaultCities对象添加相应的行。但这只是一个例子。

Answer 2

你可以试试这个：

<script>
  $(document).ready(function(){
    $('#select_days').change(function() {
      $('#text_to_be_changed').html($(this).val());
    });
    // adding pre-populate data
    $("#configfile_state").change(function(){
      var selected = $(this).val();
      if(selected == "VIC") {
        $("#configfile_site").val("Melbourne");
      }
    });
  });
</script>

我希望这对你有所帮助。

Rails：如果选择了表单中的certiain值，则填充另一个text_field

2 个答案: