0

I am trying to create a todo app in which the checkbox is created using the simple form and this needs to be submitted remotely when the checkbox is clicked. I am using the onchange() function but the form isnt getting submitted remotely. It is submitting via a full page refresh.

When a submit button is included, it submits the form remotely and everything works fine. But i am not able to get it to work without the submit button but only using the check box.

_goal.html.erb

<li id='<%= "Goal_li_#{goal.id}" %>'>
  <div class="collapsible-header"  tabindex="0">
    <label>
      <%= simple_form_for(goal, url:goal_path(goal),remote: true,authenticity_token: true) do |f| %>
        <%= f.check_box :is_complete,onchange: 'this.form.submit();', disabled:goal_disabled_class(goal), class: "check_box_check" %>
        <span class=<%= "line-through-goal" if goal.is_complete==1 %>>
          <%= goal.title %>-<%= goal.id %>-<%= goal.status %>
        </span>

        <%= "<span class='new badge blue right'> #{goal.sub_goals.where(is_complete: 0).count} </span>".html_safe if goal.sub_goals.where(is_complete: 0).count > 0  %>
      <% end %>
    </label>
  </div>
</li>

This is leading to a page refresh instead of submitting the form remotely. All the examples i have found to be working are using the submit button. How can i trigger the remote execution on the basis of checkbox click?

demir
  • 4,591
  • 2
  • 22
  • 30
user2544910
  • 1

1 Answers1

0

Because of rails-ujs it is submitted via normal HTML request. Related issue and answer.

Try this way:

onchange: 'Rails.fire(this.form, "submit")'
demir
  • 4,591
  • 2
  • 22
  • 30
  • On changing this, i am getting JS exception that Rails is not defined. I have tried these but still i am getting same error : https://stackoverflow.com/questions/56128114/using-rails-ujs-in-js-modules-rails-6-with-webpacker – user2544910 Oct 16 '19 at 05:14