Kendo Template - Convert boolean value into yes or no - kendo-ui

I have this kendo template and i am trying to convert the isDiscount boolean value into yes/no. Please suggest how can i perform this conversion.
<script type="text/x-kendo-template" id="template">
<div id="details-container">
<h2>#= Name # </h2>
<em>#= Description #</em>
<dl>
<dt>Price: #= kendo.toString(Price, "c")#</dt>
<dt>Discount available: #= isDiscount #</dt>
</dl>
</div>
</script>

You can use the conditional conversion inline like that:
<dt>Discount available: #if(isDiscount){# Yes#} else {# No#}#</dt>
There is also a demo here

Related

thymleaf th:id value in javascript

Need to check format of the value of a textfield inside the Javascript.
I am using thymeleaf for rendering the page.
To achieve this I plan to use th:id and use this inside Javascript (similar to document.getElementById and read the value. But I donot know how to get the value of the textfield inside the javascript as I am doing an iteration..
Below is the scenario
While iterating through a Map<String,Field> (where Field is a class containing two elements fieldValueList (List) and timeField(boolean) check for the format of the textField entered in the page, (format of the textfield should be hh:mm:ss) need to be done in javascript. I used id for reading the value, but donot know how to get the value of the textfield inside the javascript.
The code for the page is
<fieldSet th:each="fieldKey,fieldKeyIndex : *{recipeFieldMap.keySet()}">
<div class="fieldDiv" th:each="fieldVal,field : *{recipeFieldMap[__${fieldKey}__].fieldValueList}">
<span class="fieldSpan" th:if="*{recipeFieldMap[__${fieldKey}__].timeField}">
<input type="text" th:id="|text_${fieldKeyIndex.index}_${field.index}|" th:field="*{recipeFieldMap[__${fieldKey}__].fieldTimeValueList[__${field.index}__].displayStr}" onchange="checkTimeStr()">
<script th:inline="javascript">
/*<![CDATA[*/
function checkTimeStr() {
// Something like this.. to read the value
//var value = document.getElementById('/* text_${groupKeyIndex.index}_${field.index} */').value;
//alert(value)
}
/*]]>*/
</script>
</span>
<span class="fieldSpan" th:unless="*{recipeFieldMap[__${fieldKey}__].timeField}">
<input type="text" th:field="*{recipeFieldMap[__${fieldKey}__].fieldValueList[__${field.index}__]}">
</span>
</div>
</fieldSet>
enter image description here
try this:
<script th:inline="javascript">
[[${field.index}]]
</script>

XPATH in difficult span - Scrapy

I use Scrapy and write script based on XPATH selector. I try search XPATH syntax to collect two value: price and EAN number (500.02, 08043687312822). Price: 500,2 and EAN: 08043687312822
<div class="emProductPrice">
<span itemprop="offers" itemscope="" itemtype="http://example.com/Offer">
<span
itemprop="price" content="500.02">500,02</span> hrywna<meta itempr\
op="priceCurrency" content="PLN">
<meta itemprop="gtin14"
content="08043687312822">
<link itemprop="itemCondition"
href="http://example.com/NewCondition">
<l\ink itemprop="availability" href="http://example.com/InStock">
</span>
</div>
I try write syntax something like: //div[#class="emProductPrice"/span/span/text() but i get only: &nbsp. I need 500,02 for example
How do this? Please help.
You need:
price = response.xpath('//span[#itemprop="price"]/#content').extract_first()
ean = response.xpath('//meta[#itemprop="gtin14"]/#content').extract_first()

Does source binding require a single root element even for non-arrays?

The documentation on source binding has an aside which states:
Important: A single root element should be used in the template when
binding to an array. Having two first level DOM elements will result
in an erratic behavior.
However, I'm finding that this is the case even for non arrays.
I have the following HTML, which sets up two div's populated by two templates. The only difference is that the working template wraps that databound spans in a div.
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2013.3.1119/js/kendo.all.min.js"></script>
<title>JS Bin</title>
<script id="broken-template" type="text/x-kendo-template">
Foo: <span data-bind="text: foo"></span><br/>
Foo Again: <span data-bind="text: foo"></span>
</script>
<script id="working-template" type="text/x-kendo-template">
<div>
Foo: <span data-bind="text: foo"></span><br/>
Foo Again: <span data-bind="text: foo"></span>
</div>
</script>
</head>
<body>
<div id="broken-div" data-template="broken-template" data-bind="source: this">
</div>
<br/>
<br/>
<div id="working-div" data-template="working-template" data-bind="source: this">
</div>
</body>
</html>
And the JavaScript simply creates a view model with a single property and binds it to both divs:
var viewModel = kendo.observable({foo: "bar"});
kendo.bind($("#broken-div"), viewModel);
kendo.bind($("#working-div"), viewModel);
In both cases, only the first root element and it's children are being bound properly. This suggests that every time I databind to template with more than one element I need to make sure it is wrapped in a single root.
Is this behavior documented somewhere? Is there a bug in Kendo or in my sample code? An explanation for why Kendo requires a single root would be great to hear as well.
(Sample code as a jsfiddle)
It's not documented except in the one place you mentioned. Such is the state of Kendo UI documentation - it's less than complete. I've been using Kendo UI for three years and as far as I can tell you, this is its default behavior and not a bug. Unfortunately, it's one of the many quirks you simply learn (stumble upon) from experience.

KendoMobile UI template with query strings

UPDATE -
<script id="clientEvals-template" type="text/x-kendo-template">
<ul data-role="listview" data-style="inset">
<li>
${entry_stamp}
</li>
</ul>
</script>
It seems that chars like the ? and the = contained in a kendomobile template break the local link
ie this WONT work:
<ul data-role="list-view">
<li>${entry_stamp}</li>
</ul>
</script>
But this WILL work (without the query string
<script id="clientEvals-template" type="text/x-kendo-template">
<ul data-role="list-view">
<li>${entry_stamp}</li>
</ul>
</script>
Ive tried escaping this with mutiple chars ie \ \ // etc.. with now luck
Anyone know how to format this so that the local view is found WITH the query string?
This was a known issue, it was resolved in the current service pack release.
the fix is to format all ampersands using html encoding inline, in any icenium template script areas
ie.
<!-- always use inline html encoding in icenium template scripts ie. & -->
<script id="clientEvals-template" type="text/x-kendo-template">
<ul data-role="listview" data-style="inset">
<li>
${entry_stamp}
</li>
</ul>
</script>

Ember.js view parameter displays html as plain text

I have this view:
<script type="text/x-handlebars" data-template-name="articlesOne">
<div class="main">
<div id="articlesOne">
<h2 id="article-title">{{App.ArticlesOneController.article.title}}</h2>
<h3 id="article-lead">{{App.ArticlesOneController.article.lead}}</h3>
<div id="article-body">{{App.ArticlesOneController.article.body}}</div>
</div>
</div>
</script>
When I change the App.ArticlesOneController.article.title property to, say <p>Pragraph</p>, the browser displays the plain text, not parsed as HTML.
I would like to display that in HTML, due to building an editor on that div. How should I do that?
You should try triple brackets with {{{App.ArticlesOneController.article.title}}}. I think this link is useful for you: Show property which includes html tags

Resources