JS在点击功能上嵌入HTML,但嵌入的ruby显示为纯文本

时间:2016-03-01 10:29:56

标签: ruby-on-rails ruby-on-rails-4

我尝试应用this js fiddle添加并将表单字段添加到下面表单的下半部分。

<%  if (current_user.mod_of_game?(@guide) unless current_user.nil?) %>
   <%= form_for([@category, @page], url: update_pages_path) do |f| %>
  <%= render 'shared/error_messages', object: f.object %>

       <%= f.label :content_top, "Top Content" %>
       <%= f.text_area :content_top, :class => 'editor' %>
<br>
<br>
       <%= f.label :content_bottom, "Bottom Content" %>    
       <%= f.text_area :content_bottom, :class => 'editor' %>
<br>

<h2><a href="#" id="addScnt">Add Another Input Box</a></h2>
<div id="p_scents">
  <% @page.table_head.zip(@page.table_content).each do |head, content| %>

    <% head_key, head_value = head %>
    <% content_key, content_value = content %>
    <% if head_key == '0' %>
       <p> Column 1 Contains the name of the item, you can add more to the column or leave it blank to show just the item name <br>
   Column 1:
     <%= text_field_tag ('header[' + head_key + ']'), head_value %> 
    <%= select_tag 'content[' + content_key + ']', options_for_select(@category_keys_with_blank, ''), { :multiple => true, :size => 3}  %> </p>
    <% else %>
        <% number = head_key.to_i + 1 %>
     <p>Column <%= number %>:
    <%= text_field_tag ('header[' + head_key + ']'), head_value %> 
    <%= select_tag 'content[' + content_key + ']', options_for_select(@category_keys, content_value), { :multiple => true, :size => 3}  %> <a href="#" id="remScnt">Remove</a></p> 
    <% end%>
  <%end%>


  <%= f.submit "Save"  %>

<% end %>
</div>

我已经将小提琴中的js转换为咖啡脚本,并将其修改为我需要的地方。

$ ->
  scntDiv = $('#p_scents')
  i = $('#p_scents p').size() + 1
  $('#addScnt').on 'click', ->
    $("<%= text_field_tag ('header[' + head_key + ']'), head_value %> <%= select_tag 'content[' + content_key + ']', options_for_select(@category_keys, content_value), { :multiple => true, :size => 3}  %> <a href='#'' id='remScnt'>Remove</a></p>").appendTo scntDiv
    i++
    false
  $('#remScnt').on 'click', ->
    if i > 2
      $(this).parents('p').remove()
      i--
    false
 return

在小提琴中,它使用了.live折旧,因此我将其替换为.on。但它在点击时将所有嵌入的ruby信息添加为字符串而不是嵌入它。我可以在HTML中添加RoR编码产生但首先想知道是否有一种方法可以嵌入RoR编码而不是显示为字符串。

(作为附注,如果有一个更好的小提琴或如何添加和删除表单字段的示例我会很高兴知道它们,我无法找到其他的直接fr然而且很容易但很老了。)

1 个答案:

答案 0 :(得分:1)

在JS中,您使用以下语法来使用注入的Ruby:

$("<%= j(text_field_tag ('header[' + head_key + ']'), head_value ) %>...")

或尝试:

$("<%= (text_field_tag ('header[' + head_key + ']'), head_value).html_safe %>...")