darkknightsds
darkknightsds

Reputation: 434

React Rails: Rendering an html.erb file in React js.jsx

I have a react-rails project (ES5) in which I am trying to render a form from a _form.html.erb file in a React Component.js.jsx ... and I am really lost on how to approach this situation, if it is even possible. There are many forms in my project, but all are being rendered the traditional <%= render "samples/new_sample_form" %> way in my html.erb views. However, now I am inside a React component and am trying to pull my Rails form into the js.jsx file. I have tried creating a variable var sampleForm = "<%= render 'samples/new_sample_form' %>" but that is not working, only giving me the pathway as text and not doing anything.

So - is it possible to do what I am trying and if so... how? Thanks.

Code in js.jsx -> var taskForm = "<%= render 'tasks/new_task_form' %>" -> My result

Upvotes: 2

Views: 2874

Answers (1)

NM Pennypacker
NM Pennypacker

Reputation: 6942

In order for that to work you would have to run that file through the ERB engine. You could try renaming your React file some_component.js.jsx.erb, but that isn't really the "React" way of doing it.

You should probably get rid of your form altogether and rebuild it as a React component. You can then use Ruby to pass the props to your component. So in your view:

<%= react_component 'YourFormComponent', {prop1: 'prop1_value', prop2: 'prop2_value'} %>

Upvotes: 3

Related Questions