I am returning this from a partial view:
<script>
document.getElementById("login").style.visibility = "hidden";
document.getElementById("displayname").innerHTML = #ViewBag.DisplayName
</script>
The second script line, however, does not work.
How to write this correctly?
Greg
#Html.Raw("document.getElementById(\"displayname\").innerHTML = " + #ViewBag.DisplayName)
Related
How can I apply a tailwind class, if another var is true ... the follwoing does not seem to work.
This works
<script>
let svgColor = 'text-red-400'
</script>
<p class="{svgColor}">Test</p>
But this does not
<script>
let svgColor = 'text-red-400'
let svgVisible = true;
</script>
<p class="{svgVisible ? {svgColor} : ''}">Test</p>
By wrapping the svgColor with the curly braces you are effectively making an object with the prop svgColor.
The correct syntax would be:
<p class={svgVisible ? svgColor : ''}>Test</p>
I am using katex to render math.
https://github.com/Khan/KaTeX
Generally, to get this to work I link to the files katex.min.js and katex.min.css from a cdn, which is one of the ways the directions suggest.
I wrap what needs to be rendered in tags and give all the same class. For example:
<span class='math'>\begin{bmatrix}a & b \\c & d\end{bmatrix}</span>
And inside a script tag I apply the following:
var math = document.getElementsByClassName('math');
for (var i = 0; i < math.length; i++) {
katex.render(math[i].innerHTML, math[i]);
}
So, my implementation works but there is a problem in what katex returns. The output of the above gives me:
This exact same question is asked here:
https://github.com/j13z/reveal.js-math-katex-plugin/issues/2
But I can't understand any of it.
The solution is to use element.textContent, not element.innerHTML.
If I use a form like what follows, the matrix will be rendered properly.
var math = document.getElementsByClassName('math');
for (var i = 0; i < math.length; i++) {
katex.render(math[i].textContent, math[i]); // <--element.textContent
}
A solution that works for me is the following (it is more of a hack rather than a fix):
<script type="text/javascript">
//first we define a function
function replaceAmp(str,replaceWhat,replaceTo){
replaceWhat = replaceWhat.replace(/[-\/\\^$*+?.()|[\]{}]/g, '\\$&');
var re = new RegExp(replaceWhat, 'g');
return str.replace(re,replaceTo);
}
//next we use this function to replace all occurences of 'amp;' with ""
var katexText = $(this).html();
var html = katex.renderToString(String.raw``+katexText+``, {
throwOnError: false
});
//hack to fix amp; error
var amp = '<span class="mord mathdefault">a</span><span class="mord mathdefault">m</span><span class="mord mathdefault">p</span><span class="mpunct">;</span>';
var html = replaceAmp(html, amp, "");
</script>
function convert(input) {
var input = input.replace(/amp;/g, '&'); //Find all 'amp;' and replace with '&'
input=input.replace(/&&/g, '&'); //Find all '&&' and replace with '&'. For leveling 10&x+ &3&y+&125&z = 34232
var html = katex.renderToString(input, {
throwOnError: false});
return html
}
Which version are you using?
Edit the src/utils.js and comment line number 51 to 55 after updated run in terminal npm run build command.
In zf1, I could just do this:
$jsonData['html'] = $this->view
->render('search/partials/search-results-list.phtml');
$this->view->jsonData = $jsonData;
$this->getHelper('viewRenderer')->setRender('index-json');
$this->getHelper('layout')->disableLayout();
I tried the code below in zf2 but returns nothing on the $jsonData['html'].
$viewVar = array('some variables to be passed here');
$partial = $this->getServiceLocator()->get('viewhelpermanager')->get('partial');
$html = 'search/partials/search-results-list.phtml';
$jsonData['html'] = $partial($html, $viewVar);
return new JsonModel($jsonData);
What would be the equivalent of this in zf2?
Thanks in advance
You could pass your view to the PHP View Renderer's render method:
https://github.com/zendframework/zf2/blob/master/library/Zend/View/Renderer/PhpRenderer.php#L446
I want to see the cleaned HTML that we get from HTMLCleaner.
I see there is a method called serialize on TagNode, however don't know how to use it.
Does anybody have any sample code for it?
Thanks
Nayn
Here's the sample code:
HtmlCleaner htmlCleaner = new HtmlCleaner();
TagNode root = htmlCleaner.clean(url);
HtmlCleaner.getInnerHtml(root);
String html = "<" + root.getName() + ">" + htmlCleaner.getInnerHtml(root) + "</" + root.getName() + ">";
Use a subclass of org.htmlcleaner.XmlSerializer, for example:
// get the element you want to serialize
HtmlCleaner cleaner = new HtmlCleaner();
TagNode rootTagNode = cleaner.clean(url);
// set up properties for the serializer (optional, see online docs)
CleanerProperties cleanerProperties = cleaner.getProperties();
cleanerProperties.setOmitXmlDeclaration(true);
// use the getAsString method on an XmlSerializer class
XmlSerializer xmlSerializer = new PrettyXmlSerializer(cleanerProperties);
String html = xmlSerializer.getAsString(rootTagNode);
XmlSerializer xmlSerializer = new PrettyXmlSerializer(cleanerProperties);
String html = xmlSerializer.getAsString(rootTagNode);
the method above has a problem,it will trim content in html label, for example,
this is paragraph1.
will become
this is paragraph1.
and it is getSingleLineOfChildren function does the trim operation. So if we fetch data from website and want to keep the format like tuckunder.
PS:if a html label has children label,the parent label contetn will not be trimed,
for example <p> this is paragraph1. <a>www.xxxxx.com</a> </p> will keep whitespace before "this is paragraph1"
One way:
javascript_tag do
== "var all_product_ids = #{existing_ids.to_json};"
== "var products_json = #{#filter.data.to_json};"
or:
= %Q{
var all_product_ids = #{existing_ids.to_json};
var products_json = #{#filter.data.to_json};
}
are there any better solutions for this?
In Slim
javascript:
var all_product_ids = "#{existing_ids.to_json}";
var products_json = "#{#filter.data.to_json}";
javascript:
var all_product_ids = #{raw existing_ids.to_json};
var products_json = #{raw #filter.data.to_json};
From https://github.com/slim-template/slim
Text Interpolation paragraph
SLIM escapes HTML by default.
To avoid the same use #{{content}} for #{content}
what i prefer to do, is to keep all the javascript in a separate file.
for example, i would do it as follows(jquery):
in your layout:
...
<body data-product-ids="<%= existing_ids.to_json %>"
data-products-json="<%= #filter.data.to_json %>">
.. in js:
// create your application namespace
$.myapp = {};
$.myapp.allProductIds = $.parseJSON( $('body').attr('data-product-ids') );
$.myapp.products = $.parseJSON( $('body').attr('data-products-json') );
so, you'll then use it in js like so:
$.myapp.allProductIds
I had a similar problem with this. Using the code that others have provided didn't work for me because slim was html escaping my variable. I ended up using Gon. This one is for Sinatra, but they have a gem for Rails as well. Hope it helps others having similar problems.
create a _your_erb_file_contain_javascript_code.erb first
And then in your slim file javascript: part:
#{ conditions ? (render 'your_erb_file_contain_javascript_code') : nil}
javascript:
var isAdmin = "#{current_user.admin? ? 1 : 0}";