tinymce setContent not working with erb - ruby-on-rails

In my web application I am using the tinymce editor to allow users to create html emails. I have included a feature where they can save a template to the database so they can use it for multiple emails and access it where ever they want. But when I am trying to load the content that is stored in the database, back into the editor, it just inserts the html string. I want it so the html is rendered so they can see the template like it was when they saved it.
I think the problem has something to do with ERB because when I pass in a normal string it works fine, but when I use ERB to use an instance variable it just sets the content to the html string, not correctly formatted. Here is my code:
tinyMCE.init({
mode : "textareas",
theme : "advanced",
...
oninit : "loadTemplate"
});
function loadTemplate() {
tinyMCE.activeEditor.setContent("<%= #template %>");
}
This would just put <strong>Text Here</strong> in the editor, but this:
tinyMCE.init({
mode : "textareas",
theme : "advanced",
...
oninit : "loadTemplate"
});
function loadTemplate() {
template = "<strong>Text Here</strong>";
tinyMCE.activeEditor.setContent(template);
}
works perfectly fine and puts Text Here in the editor. What is going on here that is causing this problem?

If #template contains an HTML String, rails will automatically escape it. To prevent the escaping, try adding raw, like so:
<%= raw #template %>

Related

TinyMCE inline mode showing raw HTML rather than formatted output

I'm attempting to use the inline mode of TinyMCE with an MVC 5 page. I created the HTML content using a TinyMCE editor in the standard mode as follows:
That data is saved back to the database and then retrieved and displayed on a different page. On that page I've set up an instance of TinyMCE to display that content in the inline view as follows:
<div id="myeditablediv">#Model.LongDescription</div>
<script src="~/scripts/tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: '#myeditablediv',
entity_encoding: 'raw',
inline: true
});
</script>
I'd expected that to show the formatted HTML in a clickable TinyMCE control with no toolbars, but instead it's just showing the raw HTML:
Clicking on the control does switch it into edit mode and the toolbar appears etc:
so it looks like I'm not passing the data to be rendered to the control correctly when setting up the div with <div id="myeditablediv">#Model.LongDescription</div>?
I am guessing that your code is escaping the HTML when inserting it back into the page. I don't know ASP.NET but there is likely something you can do to #Model.LongDescription to have it place the raw HTML into the page.
A quick google search suggest this might be the answer:
#Html.Raw(#Model.LongDescription)

read rails variable on react code

How can I read a rails variable on a react component.
On my controller
#test = 'test'
On my react component
var test = "<%= #test %>"
console.log(test) // outputs ''
Is what I am trying to do possible ?
Javascript files aren't rendered in the same manner that erb files are. What you see is what you get for the most part.
If you want to serve up variables from the server that can be read by react, there are a couple of options.
In an html.erb view, create a script tag and populate it with the data
<script>var test = <%= #test %>;</script>
Create an endpoint which will respond with a JSON representation of the data. This would require the javascript to perform an ajax call to said endpoint upon the document being ready (or componentDidMount in react).

How to use a gsp template to create a text file?

I have used the Grails Rendering Plugin in the past with much success in creating PDFs. Throw now I would like to create a simple text file, using a gsp. I loved the ease of using a model to define how to insert information into the template. I realize I don't need to render a text file, but is there a similar way to use a template to just create an ordinary text file?
Example from how to render a jpg using the Grails Render Plugin: (notice the model use)
def bytes = gifRenderingService.render(template: '/images/coupon', model: [serial: 12345])
// Render to a file
new File("coupon.jpg").withOutputStream { outputStream ->
jpegRenderingService.render(template: '/images/coupon', model: [serial: 12345])
}
If there isn't an easy way like the above example, since my information is coming from multiple domain classes should I just create <g> tags in my gsp template that pulls based on conditions needed? If that is the case.. how would I insert a variable into my gsp template from my service?
You might take a look at the grails.gsp.PageRenderer utility class. It allows you to render .gsp templates as a String:
String gspOutput = groovyPageRenderer.render(view: '<your view>.gsp', model: [ modelObj1: ... ])
... or directly to a Writer or OutputStream:
groovyPageRenderer.renderTo(view: '<your view>.gsp', model: [ modelObj1: ... ], <writer or OS>)
Much more detail can be found here: http://mrhaki.blogspot.com/2012/03/grails-goodness-render-gsp-views-and.html
To render the template as text file you should set the content type of the response to text/plain
I'd think you just create your text template as standard, with <g> tags etc..., then call the standard grails render() function on the template with a contentType of 'text/plain'. No plugin necessary?
Add the following code to the GSP file
<%#page contentType="text/plain"%>

Rails how to view a txt file?

How is it possiable to open an view a txt file with rails?
Example I have test.txt:
Test test test test
Then I have my test.html.erb:
Here I want to view test.txt
You can either render an arbitrary file or use send_file: 3.1 or < 3.1
Another possibility is:
Here is the test.txt file: <%= File.read("test.txt") %>
Here is the test.txt file:
<%= File.read(File.join(Rails.root, 'your_folder','your_folder','test.txt'))%>
In some cases (when the file is not small and loading it is connected with a delay), I prefer to load the page content and then to use jQuery ajax request to load the file content.
For example, let's say I have a model with file path attribute. In the view layout I am doing something like this:
<pre data-source=" <%= (#file.path) %>"></pre>
Then in the corresponding js file I am loading the context like this:
$(document).ready ->
$.ajax(
url: $("pre").data("source")
context: document.body
).done (response) ->
$("pre").html response
return
return
Of course you can check the jQuery ajax documentation for more options. For example, you can render the pre tag with loading like this:
<pre data-source=" <%= (#file.path) %>"><div class="loading"></pre>
or use other jQuery animations as well.

Tinymce Model Binding with ASP.NET MVC

Does anyone know how to auto-populate the tinymce editor from the ASP.NET MVC model? In other words, what code do I need to use to set the contents of tinymce?
EDITED:
My problem is that tinyMCE is hiding my textbox contents. It opens blank, even though if I view the source of the page in my browser, it shows the correct info (i.e. from the Model).
Here is my code:
Javascript:
<script type="text/javascript">
tinyMCE.init({
theme: "advanced",
mode: "textareas",
plugins: "",
theme_advanced_buttons3_add: "fullpage",
theme_advanced_toolbar_location: "top"
}
);
</script>
Text Area:
<%= Html.TextArea("PostContent", Model.PostContent,30, 68, new {id="newPost"}) %>
Thanks,
Jack
<textarea><%= Model.TextAreaContent %></textarea>
Please note that since you cannot escape the contents of your string (you need proper HTML elements for TinyMCE) you have to be sure that there's nothing nasty within your string. I'm using the HTML Agility Pack to prefilter the contents before putting it into the page.

Resources