title: How to save JSON array with objects inside Rails JSON column?
body: <p>I have a Kitchen model and I want to add menu list called <code>special_kitchen_menus</code> into it.</p>
  
  <p>I can update the kitchen. But, I get this when I <code>console.log()</code> the result from database:</p>
  
  <pre><code>[{&amp;quot;name&amp;quot;=&amp;gt;&amp;quot;pizza&amp;quot;, &amp;quot;price&amp;quot;=&amp;gt;29}, {&amp;quot;name&amp;quot;=&amp;gt;&amp;quot;burger&amp;quot;, &amp;quot;price&amp;quot;=&amp;gt;24}, {&amp;quot;name&amp;quot;=&amp;gt;&amp;quot;cake&amp;quot;, &amp;quot;price&amp;quot;=&amp;gt;39}]
  </code></pre>
  
  <p>Line of code that do the console.log()</p>
  
  <pre><code>var a = "&lt;%= @kitchen.special_kitchen_menus %&gt;";
  console.log(a);
  </code></pre>
  
  <p>I try to use <code>serialize</code> and create my own method called <code>convert_to_hash</code>. But I got no luck at all.</p>
  
  <p><strong>schema.rb</strong></p>
  
  <pre><code>create_table "kitchens", force: :cascade do |t|
      # other columns
      t.json     "special_kitchen_menus",  default: {}
  end
  </code></pre>
  
  <p><strong>kitchen model</strong></p>
  
  <pre><code>class Kitchen &lt; ActiveRecord::Base
      # serialize :special_kitchen_menus
  
      # def convert_to_hash
      #   self.special_kitchen_menus = self.special_kitchen_menus.to_h
      # end
  end
  </code></pre>
  
  <p><strong>kitchen controller</strong></p>
  
  <pre><code># before_action :convert_to_hash, only: [:update]
  
  def update
      @kitchen = Kitchen.find(params[:id])
      if @kitchen.update(kitchen_params)
        redirect_to @kitchen
      else
        render :edit
      end
  end
  
  def kitchen_params
      params.require(:kitchen).permit(:special_kitchen_menus)
  end
  </code></pre>
  
  <p><strong>form</strong></p>
  
  <pre><code>&lt;%= form_for @kitchen do |f| %&gt;
      &lt;!-- other fields --&gt;
  
      &lt;label&gt;Special Kitchen Menus&lt;/label&gt;
      &lt;%= f.text_field :special_kitchen_menus %&gt;              
      &lt;%= f.submit "Update" %&gt;
  &lt;% end %&gt;
  </code></pre>
  
  <p><strong>sample data for update</strong></p>
  
  <pre><code>[
    { "name": "pizza", "price": 29 }, 
    { "name": "burger", "price": 24 }, 
    { "name": "cake", "price": 39 }
  ]
  </code></pre>
  
  <p>What should I do to update the input data correctly so that I can retrieve it back correctly just the input data without that weird characters?</p>
  
  <p><strong>Note 1</strong>: I don't want to store the data in another model OR use nested attribute. I just want to store the data inside this Kitchen model using the same Kitchen's form.</p>
  
  <p><strong>Note 2</strong>: I'm using postgres database. Not sqlite for this app.</p>