how can I use js variable in thymeleaf? - thymeleaf

I'm using 'convertHangul()' method which is in java object in html with thymeleaf.
I already checked it works but there is some problem in case of with js variable.
It works successfully without js variable as below.
let tmp = '[[${#customUtil.convertHangul(3333221)}]]';
but this case, it doesn't work.
let txt = $('#money').text();
let tmp ='[[${#customUtil.convertHangul('+txt+')}]]';
I got a thymeleaf parsing exception. I think there is some syntax error.
how can I use js variable in thymeleaf?

In order to use thymeleaf with your Java-Script code, you need to use -
th:inline="javascript" with your <script> tag.
So your code will look something like this -
<script th:inline="javascript">
...
//your code
...
</script>
Refer the thymeleaf official documentation in order to get to know more about thymeleaf with javascript -
https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#javascript-inlining

Related

Thymeleaf - use javascript as th:if condition

I am trying to use a javascript condition as a 'th:if' condition.
In specific i want to show a html element only when a scrollbar is existing in another element and tryed like this:
<div th:if="'javascript:document.getElementById(\'my-element\').scrollHeight>document.getElementById(\'my-element\').clientHeight'"></div>
Is something like this posible? Or should I do this in the '$(document).ready' function?
As #andrewjames rightly commented above, you cant embed evaluated JavaScript expressions into Thymeleaf. You might want to change your approach.
Try something like this to use javascript and thymeleaf together -
<script th:inline="javascript">
...
//your code
...
</script>
Read more about how to use thymeleaf and javascript together in official documentation -
https://www.thymeleaf.org/doc/tutorials/3.0/usingthymeleaf.html#javascript-inlining

Convert timestamp to date with JS mustache from Algolia in Rails .erb page

Hy! Im trying to convert a date in timestamp format inside a script in an .erb file. The timestamp data came directly from Algolia and the code looks like:
<script type="text/html" id="hit-template">
....
<p class="hit-name card-text">
{{{date_stamp}}}
</p>
....
</script>
How can i convert the value?
You can use transformData in the widget for that hit. In there you add something like const date = new Date(date_stamp) and return it in the object in the end. You can also format it however you want with the regular JS functions there.
See more in the documentation

Is it possible to get the html produced by a script

I have a URL from a third party site which should be the source of a script tag, something like this:
<script src="<%= #url %>"></script>
The above code shows a webform.
I would like to get the html code resulted by that code and store into a variable, something like this :
html_code = get_html('<script src="<%= #url %>"></script>')
Is that possible using Ruby/Rails (maybe using nokogiri) ?
If you're using jQuery in the browser and that code shows up in a well defined location, for example a <div> with a specific id then you can just grab it using your browser's JavaScript console:
$('#the_id').html()
That will show the raw HTML of that element presuming it dumps its content in an element with the ID the_id. You can use whatever CSS selector works.
Where that HTML goes in your document is impossible to tell from your example. A <script> can add any elements it wants anywhere in your document. You'll have to look around to see where it goes.
Load the page into a browser and then do View/Source in the browser. This will let you view the generated web page and you can find what URL was put into the <script> tag.

MVC HTML helper wrapper for jqPlot

I wish to create an MVC wrapper around jqPlot.
I want to have a helper object to render the required html container element and the required java scripts to draw the chart.
Something that will look like this:
#Html.jqPlot()
.ChartType(eChartTypes.PieChart)
.ChartData(someData)
.RenderChart();
Now I'm only at the initial design phase and I know what the jqPlot object should look like to achieve that, the problem I'm having is with the java script that suppose to be emitted to draw the actual chart using jqPlot.
Suppose I will render the following script in my .RenderChart() method
public string RenderChart()
{
string chartCode = string.format(#"
<script type="text/javascript" src="../src/plugins/jqplot.canvasTextRenderer.min.js"></script>
<script type="text/javascript" src="../src/plugins/jqplot.canvasAxisLabelRenderer.min.js"></script>
$(document).ready(function(){
var plot1 = $.jqplot ('{0}', [{1}]);
});
",this.ChartGuid, this.ChartData);
return chartCode;
}
The above is not actual code but just a general representation of the idea.
So the problem is that i don't want the Helper to emit the JS code into the body of the Html document, furthermore i cannot let it do that becuse some of the required scripts may be at the bottom of the html (as the best practice states).
Any suggestions ?
What would be the best way to emit JS code using an HTML helper if the situation requires it (like this one) ?
I think, listening to an even will be a possible solution, in this case the even of outputting or finishing the rendering of the footer. so maybe your code will give as an option to listen to an event and render at that moment, but this is of course platform dependent. I also worked on a php wrapper you can fork it here: https://github.com/oumsofiane1/jqplotPHPwrapper.git
and just implemented a helper, but of course you can extend that :-)
Hope this helps

How print ruby var inside haml in js area?

I am beginner in rails.
I have view that i try to print inside him #myvar inside js alert.
%script(type="text/javascript")
alert(#myvar);
But nothing happens,
What should I change?
First of all, you should be using :javascript filter instead of %script definition. In javascript filter you are able to use string interpolation. Try this:
:javascript
alert(#{#myvar});

Resources