如何修复 JavaScript 以便 HTML 不会显示在 collection_select
中例如<\/option>\n
, <\/select>
, <\/div>');
这是 JavaScript 启动之前的 HTML 输出:
<select name="duel[duelers_attributes][1][challenge_id]" id="duel_duelers_attributes_1_challenge_id"><option value="29">Climb Mount Everst by May 20, 2017</option>
<option value="24">Run by Feb 20, 2017</option>
<option value="26">See Drive-thru Movie by Feb 20, 2017</option>
<option value="28">Run 5 Miles on Weekdays for 10 Days Starting Jan 20, 17</option>
<option value="25">Bungee Jump by Feb 20, 2017</option>
<option value="27">Journal on Weekdays for 10 Days Starting Jan 20, 17</option></select>
这是 JavaScript 启动后的 HTML 输出:
<select name="duel[duelers_attributes][1][challenge_id]" id="duel_duelers_attributes_1_challenge_id">$("#dropdown-no-2").html("\n <option value="\"\""><\/option>\n</option><option value="\"24\"">Run by Feb 20, 2017<\/option>\n</option><option value="\"25\"">Bungee Jump by Feb 20, 2017<\/option>\n</option><option value="\"26\"">See Drive-thru Movie by Feb 20, 2017<\/option>\n</option><option value="\"27\"">Journal on Weekdays for 10 Days Starting Jan 20, 17<\/option>\n</option><option value="\"28\"">Run 5 Miles on Weekdays for 10 Days Starting Jan 20, 17<\/option>\n</option><option value="\"29\"">Climb Mount Everst by May 20, 2017<\/option><\/select>\n<\/div>")</option></select>
_dueler_fields.html.erb
<%= f.select :user_id, options_for_select(@challengers.collect { |challenger| [challenger.id] }) %>
<%= f.select :challenge_id, options_for_select(@challenger_challenges.collect { |challenged| [challenged.full_challenge, challenged.id] }) %> ,
# The problem occurs only AFTER the javascript kicks in and replaces the above line with collection_select(:dueler...
<script>
$('#duel_duelers_attributes_1_user_id').change(function () {
var user_id = $(this).find(":selected").val();
var address = "<%= user_challenges_path %>/".concat(user_id);
$.get(address, function(data) {
$("#duel_duelers_attributes_1_challenge_id").html(data);
});
});
</script>
路线
get 'duels/user_challenges/:id', :to => 'duels#user_challenges', as: 'user_challenges'
get 'duels/user_challenges/:id/:user_id', :to => 'duels#user_challenges', as: 'select'
user_challenges.js.erb
$('#dropdown-no-2').html('<%= j render partial: "user_challenges" %>')
_user_challenges.html.erb
<%= collection_select(:dueler, :challenge_id, @challenges, :id, :full_challenge, include_blank: true, id: 'dropdown-no-2') %>
AJAX 控制台输出
$('#dropdown-no-2').html('<select name=\"dueler[challenge_id]\" id=\"dueler_challenge_id\"><option value=\"\"><\/option>\n<option value=\"24\">Run by Feb 20, 2017<\/option>\n<option value=\"25\">Bungee Jump by Feb 20, 2017<\/option>\n<option value=\"26\">See Drive-thru Movie by Feb 20, 2017<\/option>\n<option value=\"27\">Journal on Weekdays for 10 Days Starting Jan 20, 17<\/option>\n<option value=\"28\">Run 5 Miles on Weekdays for 10 Days Starting Jan 20, 17<\/option>\n<option value=\"29\">Climb Mount Everst by May 20, 2017<\/option><\/select>')
最佳答案
有时 js 代码的渲染和操作取决于 js.erb 文件中单 '
和双 "
引号的使用。
尝试改变:
$('#dropdown-no-2').html('<%= j render partial: "user_challenges" %>')
至
$('#dropdown-no-2').html("<%= j render partial: 'user_challenges' %>")
这个答案可能看起来很有趣,但它适用于大多数情况。
关于javascript 渲染的 collection_select 输出 HTML 选项标签,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42547551/