• Buy the Book
  • Log in
    • Full Library
    d

    Page Builder

    Diego Enjamio(denjamio)

    Hi, im playing around page builder. Modeling Page, PageComponent and Component. I figure out need json column for save custom data for component. But now struggling how to achieve different forms for each component.

    Can you point me in the right direction? Thanks!


    Reply
    • Nick Haskins replied

      Hey Diego!

      Yep so what I would do is create a migration and set that column as JSONB, it's native to PostgreSQL and is great for storing key-value data.

      add_column :customers, :social_links, :jsonb, default:'{}'

      With that you'd be able to pull data from customer.social_links['twitter']

      Setting this up in a form you would use fields_for. I use SimpleForm but the concept is the same for vanilla Rails.

      Gist here:

      https://gist.github.com/bearded-avenger/8a16f952e0fe7208912d2f4f8d1d2b49

      Does this help?

    • d
      Diego Enjamio(denjamio) replied

      Yes! Thats is, I dont know about fields_for with jsonb, nice trick for my pocket. Now, any easy way for render the correct custom fields for each component?

      Really appreciate

    • Nick Haskins replied

      To render the fields for each component you would just put them into a normal form for the component. The fields_for would go into that same form. If you know what the key names will be, you can just do something like in the gist above.


    • j
      James Garcia(jamesgarcia) replied
      I have been playing around on creating a page builder, and thanks to your book and this post was able to get something :D I ran into one issue I am using Rails (using 6.1.4.4) or Ruby (using 2.7.3). If I set the jsonb column to default to '{}' (empty curly brackets wrapped in quotes) I get an error undefined method `each_pair' for "{}":String when passing in the column into the OpenStruct.new like you show in the gist. What I have found if a create the migration and set the default to {} (empty curly brackets without the quotes) it works.