javascript - Ruby on Rails 不加载 Javascript

Question

我有这个工作，但一定是在某个地方做了一个小改动，导致它停止工作。

我在单击按钮时调用了 Javascript，但是当我单击该按钮时没有加载任何内容。我已经多次查看代码的所有部分，但看不到故障发生的位置，日志中也没有任何反馈，所以我无计可施。

正如我所说，它之前工作正常，但后来停止了。

这是我的按钮:

            <%= button_tag t(".change"), class: "btn let-admin-change",
              data: { title: t(".confirm_switch"),
                      cancel: t(".cancel"),
                      cta: t(".confirm_cta"),
                      plot: plot.id } %>

还有我的 javascript 文件:

(function (document, $) {
  'use strict'

  $(document).on('click', '.let-admin-change', function (event) {
    var dataIn = $(this).data()

    var $changeContainer = $('.change-admin-letting-form')

    $('body').append($changeContainer)
    var $form = $('.edit_plot')

    $changeContainer.dialog({
      show: 'show',
      modal: true,
      width: 700,
      title: dataIn.title,
      buttons: [
        {
          text: dataIn.cancel,
          class: 'btn',
          click: function () {
            $(this).dialog('destroy')
          }
        },
        {
          text: dataIn.cta,
          class: 'btn-send btn',
          id: 'btn_submit',
          click: function () {

            $.ajax({
              url: '/plots/' + dataIn.plot,
              data: $form.serialize(),
              type: 'PUT'
            })

            $(this).dialog('destroy')
            $changeContainer.hide()
          }
        }]
    }).prev().find('.ui-dialog-titlebar-close').hide() // Hide the standard close button
  })

})(document, window.jQuery)

它调用的表单:

<div class="change-admin-letting-form">
  <%= simple_form_for plot, url: phase_lettings_path(@phase), remote: true do |f| %>
    <div>
      <%= f.hidden_field :letter_type, value: :homeowner %>
      <%= f.hidden_field :letable_type, value: :planet_rent %>
    </div>
    <div>
      <h3><%= t(".are_you_sure", plot: plot) %></h3>
      <p><%= t(".confirm_admin_swap").html_safe %></p>
    </div>
  <% end %>
</div>

任何人都可以看到阻止 javascript 加载的错误所在吗？

编辑

如果我添加

 <%= render "change_admin_letting_form", plot: plot %>

在按钮下方然后加载表单(但它加载多个表单 - 每个按钮实例一个表单/页面上的每个绘图)，所以我认为问题是绘图信息没有传递给表单？我不确定如何传递这些信息。

Answer 1

我已通过执行以下操作以获取表单的正确信息来实现此目的:

我已经将表单的类更改为采用变量:

<div class="hidden <%= plot_id %>">

然后通过从加载每个绘图的 block 内部呈现表单来将变量发送到表单:

<% plots.each do |plot| %>
  // some omitted code
  <%= button_tag t(".change"), class: "btn let-admin-change",
     data: { title: t(".confirm_switch"),
     cancel: t(".cancel"),
     cta: t(".confirm_cta"),
     plot: plot.id } %>
  <%= render "change_letter_type_form", plot_id: "change_letting_plot_#{plot.id}", plot: plot %>
<% end %>

并更改了加载表单的 javascript 部分以搜索新的基于绘图的类:

var $changeContainer = $('.change_letting_plot_' + dataIn.plot)

所以现在只有一个与所选绘图相关的表单加载，并且该表单按要求工作。

我对 javascript 的经验几乎为零，所以这可能不是让它工作的“正确”方法，但它确实有效，所以我会按原样使用它。