CODEWITHSUNDEEP
javascriptruby-on-railsajaxprototypejs
Noel Frostpaw
Noel Frostpaw

Reputation: 3999

Output HTML in a RJ ERB template

This might be something silly really, but I can't get it to work at all...

I have vacation.js.erb which generates some javascript to update a page when the ajax call is done. The source of the file looks like this:

$('semantic').replace('<div id="semantic"></div>');
<%
    html = '<table class="ajax">'
    html += "<tr><td>EU - 27</td><td>#{@eu.value.value} days</td></tr>"
    html += "<tr><td>#{@source.location.value}</td><td>#{@source.value.value } days></td></tr>" unless @source.location.value.blank?
    html += "<tr><td>#{@cv.country.name}</td><td>No Data Available</td></tr>" if @source.location.value.blank?
    html += "<tr><td>#{@target.location.value}</td><td>#{@target.value.value } days></td></tr>" unless @target.location.value.blank?
    html += "<tr><td>#{@vacancy.country.name}</td><td>#{@target.value.value } days></td></tr>" if @target.location.value.blank?
    html += "</table>"
%>
$('semantic').insert('<%= escape_javascript(html) %>');

I can cleary go through the code with the browser, but the last line is causing me troubles. It encodes the stuff in html to html entities, and I don't want this, cause it breaks the javascript. The response in Fiddler looks like this:

$('semantic').replace(''); $('semantic').insert('<table class=\"ajax\"><tr><td>EU - 27</td><td>28 days</td></tr><tr><td>gb</td><td>No Data Available</td></tr><tr><td>United Kingdom</td><td>29 days></td></tr></table>');

How can I prevent the page from encoding the html variable? I tried using <%! html %> but that returns nothing.

Upvotes: 1

Views: 233

Answers (1)

Noel Frostpaw
Noel Frostpaw

Reputation: 3999

fixed it, the solution was 

$('semantic').replace('<div id="semantic"></div>');
<%
    html = '<table class="ajax">'
    html += "<tr><td>EU - 27</td><td>#{@eu.value.value} days</td></tr>"
    html += "<tr><td>#{@source.location.value}</td><td>#{@source.value.value } days></td></tr>" unless @source.location.value.blank?
    html += "<tr><td>#{@cv.country.name}</td><td>No Data Available</td></tr>" if @source.location.value.blank?
    html += "<tr><td>#{@target.location.value}</td><td>#{@target.value.value } days></td></tr>" unless @target.location.value.blank?
    html += "<tr><td>#{@vacancy.country.name}</td><td>#{@target.value.value } days</td></tr>" if @target.location.value.blank?
    html += "</table>"
%>
$('semantic').insert('<%=raw html  -%>');

Found the solution here: Disable HTML escaping in erb templates

Upvotes: 3

Related Questions