CODEWITHSUNDEEP
ruby-on-railsrubyjsonhashpretty-print
chintanparikh
chintanparikh

Reputation: 1682

How do I pretty print a hash to a Rails view?

I have something like:

{"a":"1","b":"2","c":"3","asefw":"dfsef"}

I want to print it out in a view. What's the best way to do that?

I tried parsing it as a JSON object and using JSON.stringify, but it seems to mess up indentation.

Any advice? I don't mind a JavaScript solution.

Upvotes: 12

Views: 27016

Answers (7)

David Cruwys
David Cruwys

Reputation: 6862

Pretty Print Hash using pure Ruby (no gems)

I came across this thread trying to solve this problem for myself.

I had a large Hash that I wanted to make pretty, but I needed to stay in ruby hash notation instead of JSON.

This is the code + examples

  • Use pretty_generate to get a nice formatted JSON string.
  • Replace all the JSON keys with symbol: equivalent
puts JSON.pretty_generate(result)
         .gsub(/(?:\"|\')(?<key>[^"]*)(?:\"|\')(?=:)(?:\:)/) { |_|
              "#{Regexp.last_match(:key)}:"
          }

Sample JSON

{
  "extensions": {
    "heading": "extensions",
    "take": "all",
    "array_columns": [
      "name"
    ]
  },
  "tables": {
    "heading": "tables",
    "take": "all",
    "array_columns": [
      "name"
    ]
  },
  "foreign_keys": {
    "heading": "foreign_keys",
    "take": "all",
    "array_columns": [
      "name"
    ]
  },
  "all_indexes": {
    "heading": "all_indexes",
    "take": "all",
    "array_columns": [
      "name"
    ]
  },
  "keys": {
    "heading": "keys",
    "take": "all",
    "array_columns": [
      "name"
    ]
  }
}

Sample Ruby Hash

{
  extensions: {
    heading: "extensions",
    take: "all",
    array_columns: [
      "name"
    ]
  },
  tables: {
    heading: "tables",
    take: "all",
    array_columns: [
      "name"
    ]
  },
  foreign_keys: {
    heading: "foreign_keys",
    take: "all",
    array_columns: [
      "name"
    ]
  },
  all_indexes: {
    heading: "all_indexes",
    take: "all",
    array_columns: [
      "name"
    ]
  },
  keys: {
    heading: "keys",
    take: "all",
    array_columns: [
      "name"
    ]
  }
}

Upvotes: 1

hophacker
hophacker

Reputation: 61

irb(main)> puts queried_object.pretty_inspect

From PrettyPrint, so may need to require 'pp' first for this to work.

This also works great for e.g. Rails.logger output.

Upvotes: 6

Daniel Arenas
Daniel Arenas

Reputation: 525

You can try the gem awesome_print works very well, and in your view write 

<%= ap(your_hash, plain: true, indent: 0).html_safe %>

also, you can change the values for config the styles to hash view

Upvotes: 3

Phrogz
Phrogz

Reputation: 303401

If you (like I) find that the pretty_generate option built into Ruby's JSON library is not "pretty" enough, I recommend my own NeatJSON gem for your formatting.

To use it gem install neatjson and then use JSON.neat_generate instead of JSON.pretty_generate.

Like Ruby's pp it will keep objects and arrays on one line when they fit, but wrap to multiple as needed. For example:

{
  "navigation.createroute.poi":[
    {"text":"Lay in a course to the Hilton","params":{"poi":"Hilton"}},
    {"text":"Take me to the airport","params":{"poi":"airport"}},
    {"text":"Let's go to IHOP","params":{"poi":"IHOP"}},
    {"text":"Show me how to get to The Med","params":{"poi":"The Med"}},
    {"text":"Create a route to Arby's","params":{"poi":"Arby's"}},
    {
      "text":"Go to the Hilton by the Airport",
      "params":{"poi":"Hilton","location":"Airport"}
    },
    {
      "text":"Take me to the Fry's in Fresno",
      "params":{"poi":"Fry's","location":"Fresno"}
    }
  ],
  "navigation.eta":[
    {"text":"When will we get there?"},
    {"text":"When will I arrive?"},
    {"text":"What time will I get to the destination?"},
    {"text":"What time will I reach the destination?"},
    {"text":"What time will it be when I arrive?"}
  ]
}

It also supports a variety of formatting options to further customize your output. For example, how many spaces before/after colons? Before/after commas? Inside the brackets of arrays and objects? Do you want to sort the keys of your object? Do you want the colons to all be lined up?

For example, using your example Hash, you can get these different outputs, depending on what you want:

// JSON.neat_generate(o, wrap:true)
{
  "a":"1",
  "b":"2",
  "c":"3",
  "asefw":"dfsef"
}

// JSON.neat_generate o, wrap:true, aligned:true
{
  "a"    :"1",
  "b"    :"2",
  "c"    :"3",
  "asefw":"dfsef"
}

// JSON.neat_generate o, wrap:true, aligned:true, around_colon:1
{
  "a"     : "1",
  "b"     : "2",
  "c"     : "3",
  "asefw" : "dfsef"
}

Upvotes: 3

Amol Pujari
Amol Pujari

Reputation: 2349

<%= raw JSON.pretty_generate(hash).gsub(" ","&nbsp;") %>

Upvotes: 3

Belkacem REBBOUH
Belkacem REBBOUH

Reputation: 559

The given response is works fine, but if you want to have prettier and more custom pretty hash, use awesome_print 

require 'awesome_print'
hash = JSON['{"a":"1","b":"2","c":"3","asefw":"dfsef"}']
ap hash

Cheers!

Upvotes: 2

the Tin Man
the Tin Man

Reputation: 160581

How about:

require 'json'

hash = JSON['{"a":"1","b":"2","c":"3","asefw":"dfsef"}']
puts JSON.pretty_generate(hash)

Which outputs:

{
  "a": "1",
  "b": "2",
  "c": "3",
  "asefw": "dfsef"
}

JSON.pretty_generate is more of a debugging tool than something I'd rely on when actually generating JSON to be sent to a browser. The "pretty" aspect also means "bloated" and "slower" because of the added whitespace, but it is good for diagnosing and comprehending what is in the structure so it might work well for your needs.

One thing to remember is that HTML, when rendered by a browser, has whitespace gobbled up, so whitespace runs disappear. To avoid that you have to wrap the JSON output in a <pre> block to preserve the whitespace and line-breaks. Something like this should work:

<pre>
{
  "a": "1",
  "b": "2",
  "c": "3",
  "asefw": "dfsef"
}
</pre>

Upvotes: 25

Related Questions