Develop Reference

Angularjs selector with attribute

I need to make something like that:
function keyupHandler(keyEvent){
angular.element('div.keyFriendly[key='+keyEvent.key +']').click();
}
But it doesn't work. I get an error if I use angular.element(document.querySelector('div.keyFriendly[key='+keyEvent.key +']'))
I can make something like this:
function keyupHandler(keyEvent){
let mass = angular.element(document.querySelectorAll('div.keyFriendly'));
for(let i=0;i<mass.length;i++){
if(mass[i].attributes.key.value==keyEvent.key) mass[i].click();
}
}
And this fulfills my needs. But I hope there is some way to make it more short and simple, NO?

The problem is that you're not assigning the attributes value inside a string.
What you want is:
function keyupHandler(keyEvent){
angular.element('div.keyFriendly[key="'+keyEvent.key +'"]').click();
}

How to extract an value from an external html page in javascript/jquery

I have a link example this
Now I want to get the source of this page and extract the md5 hash value which is something like
<strong>MD5:</strong> 1b061e5530d2612135b8896482e68e3c</div>
<div>
I want to get the value 1b061e5530d2612135b8896482e68e3c from it.
I have made an GET request and got the source code in an variable like:
$.get(link).done(function(data){
alert(data);
});
This seems to be working fine but I have no Idea how to proceed further kindly help me .
I have Searched but not got any helpful result.

You could use good, old fashioned regexp (i.e., the second result of /MD5:<\/strong> (.*?)<\/div>/g).
var result = (/MD5:<\/strong> (.*?)<\/div>/g).exec([text])[1];
var regex = /MD5:<\/strong> (.*?)<\/div>/g;
var output=document.getElementById("output");
var test="<strong>MD5:</strong> 1b061e5530d2612135b8896482e68e3c</div>";
var matches = regex.exec(test);
output.innerHTML="MD5 is "+matches[1];
<div id="output"></div>

You can use xpath to get the text node containing the MD5 hash value:
$.get(link).done(function (data) {
var md5Node = document.evaluate('//*[#id="app_info"]/div[1]/div[2]/div[2]/div[1]/text()', document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;
var md5String = md5Node.textContent;
// ...
});
A better XPath
It would be better to find the MD5 text node based on its sibling's value. The XPath would look like
//*[text()="MD5:"]/../text()

Does the div you're trying to get the value from have an ID? If so you could try something like this
$.get(link).done(function(data){ console.log($(data).find("#idofdiv").text()); });

You could also use jQuery's .load function, like this:
$('div#container').load('external-page.html div#md5');

jQuery - console.log() returns an element but I can't access it

I happened to have super dumb issue and I'm stuck.
I do console.log(data) and I get exactly this:
<a href='http://www.someurl.com'>caption</a>
The question is how do I get this links "href" attribute.
I have absolutely no idea why, but these doesn't work:
data.text() == Uncaught TypeError: undefined is not a function (should be: caption)
$('a',data).attr('href') == undefined (should be: http://www.someurl.com)
Maybe this is not a string, but object or something else? How to check that? My JS looks like this:
window.send_to_editor = function(data) {
var videourl = data;
console.log(videourl.text()); // Uncaught TypeError: undefined is not a function
console.log(videourl); // <a href='http://www.someurl.com'>caption</a>
}

Using jQuery, you can do something like that:
var data = "<a href='http://www.someurl.com'>caption</a>";
var link = $(data).attr('href');
It will create dynamically your DOM element, then you will be able to get your attribute href.

You should first find out, what type data is. To do this you can use the JavaScript builtin function typeof(data).

It's not a jQuery object. That is why it is undefined. First, create a jQuery object.
var _videourl = $(videourl);
console.log(_videourl.text());
console.log(_videourl.attr('href'));
// caption (index)
// http://www.someurl.com
DEMO

In your case, data is a string, not a jQuery object and therefore does not have of jQuery's methods (like text).
If you are certain that data is a string containing a link, you can use a regular expression to extract the link like so:
var match = data.match(/href='(.*)'/g);
url = match && match[1];
console.log(url);
Alternately, you can create a jQuery object from your string. But that's a much more expensive operation if you just want to get the url.

how to pass a function name via JSON and call it in javascript/jQuery?

I have a JSON string which includes a function I need to call.
My JSON looks like this:
{
"type":"listview",
// the function I would like to call
"content":"dynoData.getRetailers()",
"custom_classes":["","nMT pickList","",""],
"lib":"static_listview.html",
"tmp":"tmp_listview_inset",
"lang":"locale_search",
...
I'm using this to assemble a jQuery Mobile listview on the client. To get the dynamic data, I need to call dynoData.getRetailers().
However I'm struggling to make the call :-)
This is what I'm trying:
var dyn = $.parseJSON( passed_JSON_string ),
content = dyn.content;
I had hoped calling it would trigger the function but it just returns the function name as a string.
Question:
How can trigger the actual function?
Thanks!
EDIT:
I'm putting the JSON string on the HTML element on the actual page, which I will replace with the element I'm building. Here is the HTML:
<ul data-template="true" data-config='{
"type":"listview",
"content":"dynoData.getRetailers()",
"custom_classes":["","nMT pickList","",""],
"lib":"static_listview.html",
"tmp":"tmp_listview_inset",
"lang":"locale_search",
"theme":"c",
"filter":"true"
}'></ul>
I could put all of these into data- attributes, but that would be messy...
Solution:
This worked:
1) change JSON to:
..."method":"getRetailers", ...
2) call from Javascript:
content = dynoData[ dyn.method ]();
Thanks everyone!

Assuming the function is always part of the dyn object you can use notation like following to call a function:
dyn['dynoData']['getRetailers']();
So if you are able to adjust json you could send back something like:
"content":{ "mainObject": "dynoData" , "method" :"getRetailers"}
And translate it to your dynamic function using variables:
dyn[content.mainObject][content.method]();
As an example using jQuery try using the following :
$('div')['hide']();
Which is the same as :
$('div').hide()

As charlietfl pointed out you can use object notation to call functions. For your case you have to get rid off () and split it, then call it like this;
jQuery(function($) {
var temp = $('ul').data('config').content.replace(/\(\)/g, '').split('.');
window[temp[0]][temp[1]]();
});
However this could solve your problem, if you think about future, you have to extend it a little bit. This way even you don't know the depth, you can call it anyway;
jQuery(function($) {
var temp = $('ul').data('config').content.replace(/\(\)/g, '').split('.'), func, i, il = temp.length;
for(i = 0; i < il; i++) {
if(func == null) {
func = window[temp[i]];
continue;
}
func = func[temp[i]];
}
func();
});

Try ConversationJS. It makes dynamic calls pretty easy and its a great way to decouple your codebase: https://github.com/rhyneandrew/Conversation.JS

JSON is purely data notation to be passed around so it is easily read and parsed, therefore it has no concept of functions. However, there are other ways of dealing with this and if you are starting to think that that is the only way to deal with your dilemma, then take a step back and examine your design. Instead of using this:
eval(yourCode);
Try this
var tempFun = new Function(yourCode);
tempFun();

What is wrong with this code in jquery

I am trying to get plain text out of value stored in variable like this
var lb = $(this).attr("htmllabel");
var text = $(this).html(lb);
alert(text);
When the alert popup it give result as object[Object] but I was expecting the actual string after application of the function.
Can anyone help me in this? Thanks.

$(this).html(lb)
This line is setting the html of whatever this is to whatever is stored in lb. It then returns the jquery object for chaining purposes.
If you want the html of this then you just call $(this).html() with no parameter.

Your code on the second line is setting something not getting something ...
Can you include your HTML and the actual data you want in the alert box and this might help shape the answer

Take a look at the documentation for the html method:
http://api.jquery.com/html/#html2
As you can see from the documentation your code is setting the html for this and then returning a jQuery object. What is it that you want to display exactly?

If you're simply looking to get the value of your custom attribute "htmllabel", you can do the following:
var val = $(this).attr("htmllabel");
alter(val);
As a side note; I would suggest naming custom attributes with data-*according to the HTML5 spec like this:
<div data-htmllable></div>
Your can then access the value of the attribute in two ways (jQuery 1.4.3+):
var val1 = $(this).attr('data-htmllabel');
var val2 = $(this).data('htmllabel');
// Outputs same value //
alert(val1);
alert(val2);
I hope this helps!