Rails js.erb 不呈现部分文件但得到呈现的响应文件

Posted 2023-05-09

【中文标题】Rails js.erb 不呈现部分文件但得到呈现的响应文件

【英文标题】：Rails js.erb not rendering partial file but get response file rendered

【发布时间】：2018-03-18 23:52:57

【问题描述】：

我有以下部分文件

_report.html.erb

<h5>REPORT</h5>
<hr/>
<%= link_to "Extract REPORT", "#", :class => 'btn btn-primary', id: 'load_panel' %>
<br/>
<br/>

<div class="row">
  <% rand = Time.now.to_i - Random.new.rand(1..Time.now.to_i) %>
  <div class="col-md-12">
    <input type="hidden" id="randValue" value="<%= rand %>" data-validate="false" data-hidden="true"/>
    <div>
      <b>File Name</b>
      <hr/>
    </div>
    <div id="application-attachments-<%= rand %>" class="col-xs-12">
      <%= render partial: 'report_attachment', locals: application_attachments: f.object.application_attachments %>
    </div>
  </div>
</div>


_report_attachment.html.erb

<% application_attachments.each do |attachment| %>
    <div class="fields">
        <%= render "report_attachment_fields", rep_attachment: attachment, instalment: true, type: 'application_assignment' %>
    </div>
<% end %>


_report_attachment_fields.html.erb

<div class="row attachment_display">
  <% if rep_attachment.attachment? && rep_attachment.attachment.model.share_file %>
    <% if @action == "show" && @account_type %>
      <div class="col-md-6 ellipis">
        <%= link_to File.basename(rep_attachment.attachment.path), rep.attachment.url, target: "_blank", id: 'view_file', :data =>  application_attachment_id: rep_attachment.id  %>
        <%= rep_attachment.active %>
      </div>
    <% end %>
  <% end %>
</div>

在初始加载时，它会相应地加载所有 3 个文件。但是点击提取 CTOS 后，它会发出一个 javascript 请求

application.js

$('body').on('click', '#load_panel', function(event) 
    object_selected = $(this)
    $(this).attr('disabled', 'disabled');

    $.ajax(
      type: 'GET',
      url: '/applications/generate_report?application_id='+$(this).attr('data-application-id')+'&rand_value='+$(this).attr('data-rand-value'),
      dataType: 'json',
      success: function(data) 
        object_selected.removeAttr('disabled');
      
    )
  )

在调用 GET 请求时，它会调用这个方法

def generate_report
  @rand_value = params[:rand_value]
  @rep_application_attachment = @application.rep_attachment
  respond_to do |format|
    format.js
  end
end

应该调用这个js.erb文件

generate_report.js.erb

$("#application-attachments-#@rand_value").html("<%= escape_javascript(render 'report_attachment', application_attachments: @rep_application_attachment) %>");

现在的问题是我没有收到错误，它说 generate_report.js.erb 已被渲染，但它没有渲染任何东西。我错过了什么？

【参考方案1】：

您需要指定“部分”选项以使用render 方法呈现模板。

试试这个

generate_report.js.erb

$("#application-attachments-#@rand_value").html("<%= escape_javascript(render partial: 'report_attachment', application_attachments: @rep_application_attachment) %>");

您的原始代码：

$("#application-attachments-#@rand_value").html("<%= escape_javascript(render 'report_attachment', application_attachments: @rep_application_attachment) %>");

渲染局部

控制器中的部分渲染最常与仅更新页面上的一个或几个元素而不重新加载的 Ajax 调用一起使用。从控制器渲染部分模板可以在整个页面渲染（通过从模板中调用它）和发生子页面更新时（从响应 Ajax 调用的控制器操作）使用相同的部分模板。默认不使用当前布局。

有关渲染的更多信息

https://apidock.com/rails/ActionController/Base/render

【参考方案2】：

我认为问题在于，当您需要使用 ERB "<%= %>" 时，您试图以错误的方式插入您的 ruby​​ 实例变量（您使用的是 Ruby 的字符串插值语法 "#"）。

这应该可行：

$("#application-attachments-<%= @rand_value %>").html("<%= escape_javascript(render 'report_attachment', application_attachments: @rep_application_attachment) %>");

【讨论】：

还是不行。它以某种方式调用 js.erb 但没有填充任何内容。我什至刚刚尝试寻找另一个 div 并尝试像 $('#new_div').html("testing") 这样的 smthg 但它仍然没有被填充。不知何故，它只是进入但不执行 js.erb 文件中写入的任何内容。很奇怪。这是否与 AJAX 获取函数不涉及任何 remote=true 的事实有关？

【参考方案3】：

解决了。这与我的 ajax 调用有关。

$.ajax(
      type: 'GET',
      url: '/applications/generate_report?application_id='+$(this).attr('data-application-id')+'&rand_value='+$(this).attr('data-rand-value'),
      dataType: 'json',
      success: function(data) 
        object_selected.removeAttr('disabled');
      
    )

应该是这个。通过不包括 datatype ='script' 和正确的格式，即使我的 js.erb 被调用，它也没有被执行。

$.ajax(
      type: 'GET',
      url: '/applications/generate_report?application_id='+$(this).attr('data-application-id')+'&rand_value='+$(this).attr('data-rand-value'),
      data: 
        format: 'js'
      ,
      dataType: 'script',
      success: function(data) 
        object_selected.removeAttr('disabled');
      
    )