tadasajon

tadasajon

How do I output JSON in a *.html.heex template? How do I get around Phoenix.HTML.Safe?

I have a template file that looks like the following:

<h1> The title: <%= @title  %> </h1>
<%= Jason.encode(@my_data) %>

But Phoenix is complaining, saying

protocol Phoenix.HTML.Safe not implemented for {:ok, "[{\"properties\":{\"gridProperties\":{\"etc

Apparently I can’t just output a JSON string of data into my html template?

How can I tell Phoenix that this data is safe to encode as JSON and display?

Most Liked

f0rest8

f0rest8

I just quickly tested this with @kokolegorille’s suggestion for Jason.encode!/2:

<%= Jason.encode!(%{a: 1}) %> and it outputs the tuple straight into the HTML as a string.

Jason.encode/2 throws the protocol undefined error. My to_string/1 suggestion doesn’t work for the similar reason: Jason.encode/1 returns the {:ok, String.t()} tuple whereas Jason.encode!/2 returns the String.t().

So, you would need to use Jason.encode!/2 or more specifically <%= Jason.encode!(@my_data) %> as koko suggests and it should work just fine.

f0rest8

f0rest8

Just from the error message, it sounds like you’re passing the tuple {:ok, string} and perhaps you need to just pass the string.

I haven’t tested or really familiar but looks like the inputs it has a protocol for are here in the docs.

Then it’ll return either the {:ok, String.t()} or the error tuple.

Edit

I realize the error message is cause you’re passing the :ok tuple to the template rather than a string.

Ah I think you might want to use a helper function or similar so you can clean the return you’re getting to be the string you want to stick in there.

You could even just write <%= to_string(Jason.encode(@mydata)) %> if you want to show the tuple.

Not totally sure what you’re asking, again, but if you want to render the json inside your html then you might want to check out how livebook approaches rendering different outputs inside the “cell” of the html page to draw inspiration.

kokolegorille

kokolegorille

Maybe like this?

<pre><%= Jason.encode!(@my_data) %></pre>

Note the exclamation mark.

Where Next?

Popular in Questions Top

vertexbuffer
Hello, can anybody help here..? I have a list of players and I what to delete an element, but every for loop the list is reverting to ori...
New
sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
qwerescape
Is there a way to get the call stack or stack trace at any point in the code? Not from exceptions, but an expression that returns how the...
New
albydarned
Hello all! I am typing this post from my new MacBook Pro with the M1 chip. I’m loving it so far, and will probably use it as my daily dr...
New
Fl4m3Ph03n1x
About me? ( if you have nothing better to do than reading about some random guy in the internet :stuck_out_tongue: ) Hello all, this is ...
New
minhajuddin
I have seen a lot of code which picks the first element from a list using Enum.at(0) instead of List.first. Is there a reason why people ...
New
stefanluptak
Hello everybody, usually, I use a 29" ultra-wide monitor for VSCode which can easily accomodate explorer (files panel) + file with code ...
New
nobody
How to bind a phoenix app to a specific ip address? could not find anything about that, nowhere, unfortunately, but for me this is qui...
New
hariharasudhan94
I would like to know what is the best IDE for elixir development?
New
senggen
Erlang/OTP 25 [erts-13.2.2] [source] [64-bit] [smp:8:8] [ds:8:8:10] [async-threads:1] 15:22:35.803 [error] gen_event {lager_file_backend...
New

Other popular topics Top

aadeshere1
I have a another noob question about loop. Since elixir is immutable, while loop is not directly possible. total = 10 while total != 0 ...
New
Harrisonl
We have an ECS cluster with 4 services, where each task joins a single cluster, via discovery ECS discovery service. Currently when I de...
New
sen
Hi All, I set a environment variables in dev.exs , like below code. when i start server, how can i set the ${enable} value? thanks. d...
New
JakeBecker
TL;DR: I’ve just released an implementation of Microsoft’s IDE-independent Language Server Protocol for Elixir. It adds language support ...
1144 53578 245
New
AstonJ
Posting this to see if we can make things easier for people to get into Neovim. If you use Neovim and have a favourite distro please let ...
New
josevalim
Hi everyone, One of the features added to Elixir early on to help integration with Erlang code was the idea of overridable function defi...
New
dokuzbir
I want to highlight html closing tags when i click a html tag. That works in .html files but doesnt work for html.eex templates. How can...
New
jerry
Good day to you all. I have been struggling to get a query involving like and ilike to work. Can anyone assist me on this, please? pro...
New
AngeloChecked
What learn first? Rust or Elixir Hi Elixir community! I’m here because i want learn a new language. I’m a junior developer and mainly i ...
New
nobody
Hi! In PHP: $SERVER['SERVERADDR'] - in Elixir? Searched the docs for ip address and the web, no good results. Thanks!
New

We're in Beta

About us Mission Statement