收集复选框的值并使用所述值自动选中其他div中的框

时间:2014-04-08 11:39:31

标签: javascript jquery html css ruby-on-rails

<% if !result.platforms.nil? %>
<div class="platforms">
<div class="btn-group" data-toggle="buttons">
<% result.platforms.each do |platform| %>
<label class="btn btn-default">
<input type="checkbox" name="options" class="platbtn" value= <%=platform.id %> ><%= platform["name"] %></label>
<% end %>
</div>
</div>
<% end %>

...

<% result.platforms.each do |platform| %>
<span class='select_platform'>
<%= check_box_tag "game[platforms][id][]", platform.id %>
<%= label_tag "game[platforms][name][]", platform.name %>
</span>
<% end %>

此代码变为......

<span class="select_platform">
<input id="game_platforms_id_" name="game[platforms][id][]" type="checkbox" value="19">
<label for="game_platforms_name_">Game Boy Advance</label>
</span>

好的,有了这个,我想在#platforms div中按下/检查按钮/复选框的值(platform_id)并自动检查span类“select-platform”中的相应框。 / p>

我已经尝试了许多不同的方法来获取所述盒子的值但是当我去查看阵列时,里面什么都没有。我不确定我是否只是在两种情况下只是要求错误的方法或什么。

我尝试获取和存储值的最后一种方法是在堆栈溢出的其他位置找到此代码段。

var values = $('input:checkbox:checked.platbtn').map(function() {
return this.value;
}).get();

2 个答案:

答案 0 :(得分:0)

似乎复选框没有value所以你应该将你的值存储在html data-attribute中。 你还必须使用jQuery包装this

HTML

<input type="checkbox" name="options" class="platbtn" data-value= <%=platform.id %> >

JS

$(':checked.platbtn').map(function(){ return $(this).data('value');}).get();

答案 1 :(得分:0)

首先,您需要知道如何识别范围内的每个复选框。当您使用id将值作为参数传递时,一种简单的方法是使用类属性:

<%= check_box_tag "game[platforms][id][]", platform.id, false, class: platform.id  %>

这样您就可以使用$('.your_id')访问此复选框,因此您可以在所有平台上附加更改事件复选框,如下所示:

$(".platforms input[type=checkbox]").on("change", function() {
  var selected = $(this).val(); // This will get the value
  $("."+selected).prop('checked', 'checked'); // This will check the box
});