0

I create the form in this way:

= form_for Review.new do |f|
  = react_component "Popups/ReviewPopup", {name: "review-popup"}

Inside the Popup/PreviewPopup I have a form field with the desired name.

And when click on the submit occurs:

const SendButton = ({ onSubmit }) => (
  <button
    onSubmit={e => {
      e.preventDefault();
      onSubmit(e);

    }}
    className="button popup-footer__button"
  >
    Send
  </button>
);

After that, without rebooting, data from the form should be sent and the message should appear in the browser.

During a normal send everything works perfectly.

How to implement remote: true? I want to implement a remote: true and not to catch data from fields when the user click and send them using the axios to the server.

evans
  • 549
  • 7
  • 22
  • `remote: true` just adds a `data-remote` attribute to the form. jQuery Rails adds an ajax event handler to forms (and links) with the `data-remote` attribute. As Зелёный pointed out - its not magic. And its not something you want to use if you are using React as it will just get in the way. – max Jul 22 '19 at 12:40

1 Answers1

0

You need to use rails-ujs library.

import Rails from 'rails-ujs'; // for webpack

To submit a form run the next command:

Rails.fire(document.getElementByID('FORM-ID'), 'submit');
Alex Kojin
  • 5,044
  • 2
  • 29
  • 31