Put multiple form fields into single hash, then into single cell (React and Rails)

So I'm really new to using React and Javascript, and have been following a tutorial located here: https://www.airpair.com/reactjs/posts/reactjs-a-guide-for-rails-developers#reactive-data-flow-editing-records I am attempting however to create a form such that all the form fields, when submitted, will be put into a hash and then placed into the model's "detail" attribute which has the store: property put on it. For example, once the form fields under "Name", "City", and "Country" are entered and submitted, the only thing put to the database would be {"Name" => "temp", "City" => "temp1", "Country" => "temp2"} in the "detail" column I'm really confused on how I should be doing this... Please help! Thanks! The "Name" and "Action" properties of the Request will be automatically filled out and submitted, it is only the "Detail" property of the Request that will be affected by the form. requests_controller.rb class RequestsController < ApplicationController def index @requests = Request.all end def create @request = Request.new(request_params) if @request.save render json: @request else render json: @request.errors, status: :unprocessable_entity end end private def request_params params.require(:record).permit(:name, :action, :detail) end end request.rb class Request < ActiveRecord::Base store :detail end request_form.js.coffee @RequestForm = React.createClass getInitialState: -> name: '' action: '' detail: '' handleChange: (e) -> name = e.target.name @setState "#{ name }": e.target.value handleSubmit: (e) -> e.preventdefault() #... not sure how to do this valid: -> @state.detail render: -> #also doubt the form is correct for this situation React.DOM.form className: 'form-inline' React.DOM.div className: 'form-group' React.DOM.input type: 'text' className: 'form-control' placeholder: 'Name' name: 'detail' value: @state.detail onChange: @handleChange React.DOM.div className: 'form-group' React.DOM.input type: 'text' className: 'form-control' placeholder: 'City' name: 'detail' value: @state.detail onChange: @handleChange React.DOM.div className: 'form-group' React.DOM.input type: 'text' className: 'form-control' placeholder: 'Country' name: 'detail' value: @state.detail onChange: @handleChange React.DOM.button type: 'submit' className: 'btn btn-primary' disabled: !@valid() 'Create Team' requests.js.coffee @Requests = React.createClass getInitialState: -> requests: @props.data getDefaultProps: -> requests: [] addRequest: (request) -> requests = @state.requests.slice() requests.push request @setState requests: requests render: -> React.DOM.div className: 'requests' React.DOM.h2 className: 'title' 'Team Requests' React.createElement RequestForm, handleNewRequest: @addRequest React.DOM.hr null React.DOM.table className: 'table table-bordered' React.DOM.thead null, React.DOM.tr null, React.DOM.th null, 'Name' React.DOM.th null, 'Action' React.DOM.th null, 'Detail' React.DOM.tbody null, for request in @state.requests React.createElement Request, key: request.id, request: request request.js.coffee @Request = React.createClass render: -> React.DOM.tr null, React.DOM.td null, @props.request.name React.DOM.td null, @props.request.action React.DOM.td null, @props.request.detai