resolving single quote inside a variable - javascript

I have a javascript function call where my ${v.a} is getting
resolved to name like CNX'ion .so My call is failing because in the end it has three quotes like
<a href="javascript:editVendorDetails('${v.a}')// this changing into
<a href="javascript:editVendorDetails('CNX'ion')//have three quotes
can any one tell me how to get value of ${v.a} in my js function which may have quotes inside as explained above

use can use JSON.stringify('${v.a}')

Related

Protractor expected returns with brackets instead of quotes

I am testing a webpage and need to use this repeater and model to make sure that the correct text was entered.
I tried doing this to get the expected text to match what I want:
expect(element.all(by.repeater('n in [].constructor(product.config.num_streamers) track by $index')).get(1).all(by.model('name.value')).getAttribute('value')).toEqual("testtext");
My issue is its showing an object with brackets instead of just text in quotes. This is my failed exception.:
Expected [ 'testtext' ] to equal 'testtext'.
The only reason this fails is because there are open and closing brackets with a space. Could someone help me find a solution and explain why the brackets appear?
You are calling getText() on an array of elements (which is called ElementArrayFinder in Protractor) and, it returns a promise which resolves into array of texts of all the matching elements.
Since you actually need a single element, use .element instead of .all:
expect(element.all(by.repeater('n in [].constructor(product.config.num_streamers) track by $index')).get(1).element(by.model('name.value')).getAttribute('value')).toEqual("testtext");
Additional notes:
instead of toEqual(), you could have also used toContain() matcher
you don't need the track by part in the by.repeater() - it is automatically omitted by Protractor
to make the code more readable, declare the element outside of the matcher - or, even better, apply the Page Object pattern:
var elm = element.all(by.repeater('n in [].constructor(product.config.num_streamers)')).get(1).element(by.model('name.value'));
expect(elm.getAttribute('value')).toEqual("testtext");

value is taken as parameter on function

im passing a value retrieved from an ajax call to a function like this way:
nuevaFila+='<td><input type="button" value="Agregar" onclick="AgregarSuvenir('+item.CODSUVENIR+');"></td></tr>';
and we i clicked the button it throws an undefinided "variable" but is not a variable, i just wanted to pass it as a string, and the value passed to the function is taken as a variable, i tried
onclick="AgregarSuvenir("'+item.CODSUVENIR+'") and onclick="AgregarSuvenir('+item.CODSUVENIR+""')
but this fails
someone help me how to pass the value as string and not be taken a a variable.
thanks is advance
This is a simple case of matching quotes. Because you use single quotes to delimit the string, you must add escaped quotes inside your function call in order for the inserted value to be treated like a string.
Here are two possible solutions that escape the quotations to allow for the parameter to the AgregarSuvenir function to be treated like a string:
nuevaFila+='<td><input type="button" value="Agregar" onclick="AgregarSuvenir(\''+item.CODSUVENIR+'\');"></td></tr>';
or:
nuevaFila+="<td><input type=\"button\" value=\"Agregar\" onclick=\"AgregarSuvenir('"+item.CODSUVENIR+"');\"></td></tr>";
found it!
it has to be formatted like stated on this post: pass string parameter in an onclick function
onclick="AgregarSuvenir(\''+item.CODSUVENIR+'\')

Angular : How does ng-click directory parses the expression without doubly curly brace?

I have a view as follwing,
<li ng-repeat="img in people.images">
<img ng-src="{{img}}" ng-click="setImage(img)">
</li>
Its working. But my doubt here is, the attribute ng-click should have been set the img inside doubly braces to be executed as in ng-src as ng-click="setImage({{img}})". Its shown below,
<li ng-repeat="img in people.images">
<img ng-src="{{img}}" ng-click="setImage({{img}})">
</li>
But the later is not working.
How the expression is parsed here and how does ng-click vary from ng-src?
I really confused here. Any help highly appreciated.
The difference is the following: Some of the directives use expressions, some don't. This is how they "vary" from each other. You may use the angular documentation to see, which directive use expressions and which don't.
Example for ng-click: https://docs.angularjs.org/api/ng/directive/ngClick It uses an expression:
Example for ng-src: https://docs.angularjs.org/api/ng/directive/ngSrc It doesn't use an expression:
ngClick lets you define a JavaScript-like expression, while ngSource lets you define an usual String, where you also may define an expression, inside the double braces. According to the AngularJS documentation, everything inside of the double braces is also an expression: https://docs.angularjs.org/guide/expression.
I think that the "need" to have the difference between "Expression" for "ngClick" and "String" for "ngSrc" come from the original attributes they derive from: onclick and src.
The attribute src is used to reference a resource as String, while using the attribute onclick, you may use javascript. The usual case is to call a function in onclick, i.e. onclick="doSomething();". I assume that angularjs uses these attributes as a base, this is why the workflow is similar. ngClick lets you use usual javascript expressions, while ngSrc lets you use a String and add a {{}} expression if you need to.
The benefit of using ngSrc with a variable, for example ngSrc="http://localhost/{{myRessource}}" is, that it is evaluated only after $scope.myRessource is set, not before. It uses the observer pattern to render the view as soon as the variable is set, as far as I know.
According to your example, the second one which doesn't work:
<li ng-repeat="img in people.images">
<img ng-src="{{img}}" ng-click="setImage({{img}})">
</li>
It doesn't work because of a syntax error. ngClick uses javascript expression, and the syntax of setImage({{img}}) is not correct - you would not use double brackets around variables either in a javascript function.
Further: $interpolate and $parse
Like stated above, some directives, like ngClick use expressions, while other directives like ngSrc use plain Strings combined with {{}}. The difference between the two on angularJs side is the following:
a directive using an expression is evaluated by angularjs using $parse (Read here from heading "Text and attribute bindings")
a directive using a String is evaluated by angularjs using $interpolate (Read here from heading "Context")
Example:
$scope.varOne = "asdasdasd";
var test1 = $interpolate("http://localhost/{{varOne}}");
$scope.displayOne = test1($scope);
At first, we declare a variable varOne. $interpolate returns a function which needs to be called with the scope, we will bind this to the local variable test1. Then we will call test1 using the $scope. As a result, we will have on displayOne the String http://localhost/asdasdasd.
var test2 = $parse("1+5-3");
$scope.displayTwo = test2($scope);
$parse is evaluating javascript expressions, as a test we may use the calculation "1+5-3". After calling test2, the result will be 3.
I prepared a fiddle, so you can see this: http://jsfiddle.net/wSN54/6/
You may also try using brackets in the $parse evaluation (the same that happens in your second example):
$scope.varTwo = 2;
$scope.varThree = 3;
var test2 = $parse("{{varTwo + varThree}}");
$scope.displayTwo = test2($scope);
This must resolve in an error, because the double braces are not used in usual javascript expression:
Check it out fiddle: http://jsfiddle.net/wSN54/8/
As far as I know, if you put img param inside double brackets, when the page is rendered, you will notice that the parameter inside setImage function is a value of img. If you put img without brackets you will have rendered "setImage(img)" and in both case that will work.
Example:
imagine that you have one item in people.images model, and its for example "example.jpg". If you use brackets in setImage function, when the page is rendered you will see the attribute "ng-click=setImage('example.jpg')", in another approach you will have "ng-click=setImage(img)". In first case AngularJS don't need to parse value from your parameter, because you already put 'example.jpg' like a parameter, in another case AngularJS will parse value from img parameter/item before your function is executed.
TLDR; ng-src $interpolate the argument as template where ng-click $parse the expression
Long version
Copied from angular official docs
param=ngSrc, type=template
param=ngRepeat, type=repeat_expression
details refer to https://docs.angularjs.org/api/ng/directive/ngSrc and https://docs.angularjs.org/api/ng/directive/ngRepeat
What is expression - https://docs.angularjs.org/guide/expression
What is template(markup) - https://docs.angularjs.org/api/ng/service/$interpolate

how to call javascript function from client side on anchor click

I have javascript function sample('textValue') and have to call at server side on anchor click. I tried below code
string text="xyz";
anchor.Attributes.Add("onclick","javascript:sample('"+text+"');
but the value of the text is not assigning correctly. Encoded string gets added. The result in view source looks like
javascript:sample('xyz')
But i need javascript:sample('xyz')
What server/backend language do you use? PHP? Do you use any framework (Zend, CakePHP...)?
On the JS side do something like this:
Option 1
Test
Option 2
Test
<script type="text/javascript">
document.getElementById('clicky-clack-link').onClick = function() {
sample('test');
};
</script>
Note: Also check out jQuery if you haven't.
I wonder if you could just do this:
string text="xyz";
anchor.Attributes.Add("onclick", function(){ sample(text); } );
What does it do? Well, the onclick handler takes a function with no arguments, right? That is, what to do if somebody clicks the link. If you're coding this by hand in HTML, you can use the javascript:a_statement_goes_here to describe the code to run. I expect the browser will just create a function out of that. Since you're assigning this in JavaScript, you have to do that yourself (unless you write out to the document - that might work) and assign the function. But you don't have such a function yet - you have one sample that takes an argument - hence the anonymous function closing the text argument.
This is based on the assumption, that the above is actually client-side code. I'd be very surprised, if JS didn't allow you to assign a function to an attribute. In fact, I think the problem you are running into, is JavaScript trying to be very smart and make sure assigning a string, will stay a string - that is why your ' got encoded.
Have a go, tell me how it went. Ta!

JavaScript: Sending comma separated string of parameters to a javascript function

I am having a function in javascript as
function add(v1,v2){
var add=v1+v2;
}
Now I am calling this function as below -
write.out(var param="1,2";);
write.out(window[add](param););
Using the above call, it's not working. What it does is it gives the complete string "1,2" as value to the first param(v1) of the function.
Its working if I call the function in following way -
write.out(var param1="1";);
write.out(var param2="2";);
write.out(window[add](param1,param2););
I want to achieve it using the first way where i can send the parameters as a comma separated string of parameters.
Can some one help me out how this can be done...
Thanks!!!
You can make usage of ECMAscripts .apply(), which calls a function and accepts an array of paramters.
window['add'].apply(null, param.split(','));
That way, we execute the add function, setting its context to null (you could also change that if you need) and pass in the two paramters. Since we need an Array, we call split() on the string before.
So basically, the above line is the same as
add(1,2);
Since you're haveing that function in the global context (window), we don't even need to write it that explicitly.
add.apply(null, param.split(','));
will just be fine.

Categories