Ruby on rails not loading Javascript

Question

I had this working, but must have made a minor change somewhere that's stopped it working.

I have a call to Javascript when clicking on a button, but when I click the button nothing loads. I've gone over all parts of the code multiple times but cannot see where the failure is happening and there's no feedback in the logs so I have nothing to go on.

As I said it was working previously, but then stopped.

This is my button:

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

And my javascript file:

(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)

And the form it's calling:

<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>

Can anyone see where this is going wrong to stop the javascript from loading?

EDIT

If I add

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

underneath the button then the form loads (but it loads multiple forms - one form for each instance of the button / each plot on the page), so I assume the issue is that the plot information is not being passed to the form? I'm not sure how to pass this information across.

"As I said it was working previously, but then stopped." - ah, it's the easiest of the errors. Simply revert to known good state, reintroduce the changes again, bit by bit, and see where it breaks. — Sergio Tulentsev
– Sergio Tulentsev, Commented Aug 15, 2019 at 12:00

DevCF · Accepted Answer · 2019-08-15 12:54:00Z

2

I've managed to get this working by doing the following to get the correct information to the form:

I've changed the class of the form to take a variable:

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

And send the variable to the form by rendering the form from inside the block that loads each plot:

<% 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 %>

And changed the part of the javascript that loads the form to search for the new plot-based class:

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

So now only the one form relevant to the selected plot loads, and the form works as required.

I have next to zero experience with javascript, so this probably isn't the 'proper' way to get this to work, but it works so I'll take it as it is.

answered Aug 15, 2019 at 12:54

DevCF

876 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

noumena Over a year ago

Check this out: guides.rubyonrails.org/working_with_javascript_in_rails.html especially the unobtrusive stuff.

Collectives™ on Stack Overflow

Ruby on rails not loading Javascript

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related