Kendo UI template syntax in TabStrip - kendo-ui

I have a kendo template that contains a tabstrip. In this tabstrip I have item that use the kendo template syntax like so:
items.Add().Text("Block Attributes").LoadContentFrom("BlockAttributes", "Properties", new { blockRef = "#=BlockRef#" });
In this case the block ref gets output as expected. However when using the .Action() method like so:
items.Add().Action("Details", "Properties", new { fiscalYear = Model.FiscalYear, blockRef = "#=BlockRef#" }).Text("Details");
the propertyId uses the literal string that is typed so it will try to navigate using "#=BlockRef#" as a parameter which results in an error.
Why does it work ok for the former but not the latter? How do I get this to work?

A solution I have found, although probably ill-advised is to do the following:
items.Add().Text("Details").Url(Url.Action("Detail", "Properties", new { fiscalYear = Model.FiscalYear, blockRef = -1 }).ToString().Replace("-1", "#=BlockRef#"))
It seems there is no way to get Kendo templates to work directly with Url.Action(), the html has to first be generated and then parameters have to be individually replaced. I used -1 as BlockRef is expecting an int and there is no possible way for -1 to appear naturally in the system.

Related

How to check either the headline or the content should contain "FIFA" keyword?

How do I write this test in Cypress?
enter image description here
I have to confirm that either the headline or paragraph should contain the same keyword.
It's better to have JQuery elements in hand before the assertion so that you can use JQuery methods on them. cy.get() acts just like $(...) in JQuery, it will be enough to have the elements. (more here)
Once u have the elements, i.e. $el1 and $el2 below, then you can get their text via .text() method (more here) and then you can write your assertion.
Instead of a separate assertion, below I used a single one and checked if either of them includes the desired text by using || operator.
cy.get('first-el').then($el1 => {
cy.get('second-el').then($el2 => {
const inEl1 = $el1.text().includes('FIFA');
const inEl2 = $el2.text().includes('FIFA');
expect(inEl1 || inEl2).to.be.true;
});
});

How to verify a dynamic value with a space using jasmine expect(check).toContain(value)?

I want to validate a value , which is dynamic and retrieved from one page to another. That element also has space on it.
Below is my coding for that.
Page - 1
var PerAge = element(by.css("h1 > span.ng-binding")).getText();
This element has space on it , like this - > name
Page-2 - > same value displayed in an other page. This element has no space on it.
var HumAge = element(by.repeater("slide in ctrl.slides track by $index")).getText();
Now, I want to validate the value on Page 2 is same or not. Since , the repeater has bunch of other values , so I am using .toContain to validate the value.
The issue here is , the PerAge has space on it.
I checked this stack overflow question , but it did not work.
Expected '> ' to equal '> ' in jasmine.
expect(PerAge).toContain(HumAge);
Its returning following error
Expected 'Shane' to contain ' Shane'.
I tried trim, It doesn't recognize trim.
I cannot use .ToEqual like below since the element have bunch of other things.
expect(PerAge).toEqual('\xA0HumAge')
If I understand you correctly, you retrieve a value on page 1 like this:
var PerAge = element(by.css("h1 > span.ng-binding")).getText();
and use it on page 2 to compare it:
var HumAge = element(by.repeater("slide in ctrl.slides track by $index")).getText()
expect(HumAge).toEqual(PerAge);
This fails due to the spaces.
The reason why you can't use .trim() is because .getText() returns a promise. You first need to resolve the promise before you can use .trim().
What you can do is for example this. You also find an example of the code if you use a transpiler like Babel or use TypeScript which both support Async/Await.
var PerAge, HumAge;
element(by.css("h1 > span.ng-binding")).getText()
.then(function(text) {
PerAge = text.trim();
});
// Go to page 2
element(by.repeater("slide in ctrl.slides track by $index")).getText()
.then(function(text) {
HumAge = text.trim();
});
expect(HumAge).toEqual(PerAge);
// If you can use async await because you transpile with Babel or use typescript you can do this to tidy the code
// $ is the Protractor shorthand for the `css`-locator
const PerAge = (await $('h1 > span.ng-binding').getText()).trim();
const HumAge = (await $('[ng-repeater="slide in ctrl.slides track by $index"]').getText()).trim();
expect(HumAge).toEqual(PerAge);

Getting values from Kendo Grid row on DetailExpand

I have got a Kendo Grid and I want to access the data from the row whose detail I expanded. For testing purposes, I have this:
function detailExpand(e)
{
var aux = e.sender.MyModelId;
var aux2 = this.MyModelId;
...
But none of those variables have the MyModelId in it.
I have inspected it and I can't find the model properties unless inside the e.sender._data[index-here] but I don't know the index of the row whose detail I've expanded.
e.sender.dataItem(e.masterRow).MyModelId
http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#events-detailExpand
http://docs.telerik.com/kendo-ui/api/javascript/ui/grid#methods-dataItem
For the record, you should try to avoid using methods starting with an underscore (_). I believe kendo uses the underscore to show it's an internal method (a "private"). Unexpected behavior could occur.

Trying to get environment variables from a Widget widget.system()

I'm attempting to write some Dashcode to but can't seem to get the environment variables when I run the /env command. The environment doesn't appear to be sourced because it always returns "Undefined". Below is my code and I'm open for any suggestions (I need more than just LANG, LANG is just the example).
var textFieldToChange = document.getElementById("LangField");
var newFieldText = widget.system("/usr/bin/env | grep LANG").outputString;
textFieldToChange.value = newFieldText;
Is there an easy way to source my environment and cache it in Dashcode or do I need to attempt to write something that will cache the entire environment somehow?
Thanks for any ideas!
Have you allowed Command Line Access? Go to Widget Attributes (in the left hand menu) , then extensions and check Allow Command Line Access else the widget is prevented from talking to the system. Not sure if this is what is causing the problem though.
I know this thread is quite aged, but anyway, the question is still up to date :-)
Just having started with Dashcode and widgets myself, I did a quick hack on this:
function doGetEnv(event)
{
if (window.widget)
{
var out = widget.system("/bin/bash -c set", null).outputString;
document.getElementById("content").innerText = out;
}
}
For my experimental widget, I did use a scroll area and a button. The doGetEnv(event) is fired upon onclick, set via inspector. The Id "content" is the standard naming of the content within the scroll area.
The out var containes a string with '\n' charaters, to transform it into an array use split().
function doGetEnv(event)
{
if (window.widget)
{
var out = widget.system("/bin/bash -c set", null).outputString;
out = out.split("\n");
document.getElementById("content").innerText = out[0];
}
}
The first entry is "BASH..." in my case.
If you search for a particular item, use STRING's match method (see also http://www.w3schools.com/jsref/jsref_match.asp) along with the following pages on regular expressions:
http://www.w3schools.com/jsref/jsref_obj_regexp.asp
http://www.w3schools.com/js/js_obj_regexp.asp
To cache the environment, you can use:
var envCache = "";
function cacheENV()
{
envCache = widget.system("/bin/bash -c set", null).outputString;
envCache = envCache.split("\n");
}
This will leave an array in envCache. Alternative:
function cacheENV()
{
var envCache = widget.system("/bin/bash -c set", null).outputString;
envCache = envCache.split("\n");
return envCache;
}

Google AJAX Transliteration API: Is it possible to make all input fields in the page transliteratable?

I've used "Google AJAX Transliteration API" and it's going well with me.
http://code.google.com/apis/ajaxlanguage/documentation/referenceTransliteration.html
Currently I've a project that I need all input fields in every page (input & textarea tags) to be transliteratable, while these input fields differs from page to page (dynamic).
As I know, I've to call makeTransliteratable(elementIds, opt_options) method in the API call to define which input fields to make transliteratable, and in my case here I can't predefine those fields manually. Is there a way to achieve this?
Thanks in advance
Rephrasing what you are asking for: you would like to collect together all the inputs on the page which match a certain criteria, and then pass them into an api.
A quick look at the API reference says that makeTransliteratable will accept an array of id strings or an array of elements. Since we don't know the ids of the elements before hand, we shall pass an array of elements.
So, how to get the array of elements?
I'll show you two ways: a hard way and an easy way.
First, to get all of the text areas, we can do that using the document.getElementsByTagName API:
var textareas = document.getElementsByTagName("textarea");
Getting the list of inputs is slightly harder, since we don't want to include checkboxes, radio buttons etc. We can distinguish them by their type attribute, so lets write a quick function to make that distinction:
function selectElementsWithTypeAttribute(elements, type)
{
var results = [];
for (var i = 0; i < elements.length; i++)
{
if (elements[i].getAttribute("type") == type)
{
results.push(elements[i]);
}
}
return results;
}
Now we can use this function to get the inputs, like this:
var inputs = document.getElementsByTagName("input")
var textInputs = selectElementsWithTypeAttribute(textInputs, "text");
Now that we have references to all of the text boxes, we can concatenate them into one array, and pass that to the api:
var allTextBoxes = [].concat(textareas).concat(textInputs);
makeTransliteratable(allTextBoxes, /* options here */);
So, this should all work, but we can make it easier with judicious use of library methods. If you were to download jQuery (google it), then you could write this more compact code instead:
var allTextBoxes = $("input[type='text'], textarea").toArray();
makeTransliteratable(allTextBoxes, /* options here */);
This uses a CSS selector to find all of the inputs with a type attribute of "text", and all textareas. There is a handy toArray method which puts all of the inputs into an array, ready to pass to makeTransliteratable.
I hope this helped,
Douglas

Resources