Develop Reference

Wrapping javascript concatenated html correctly with ",' and \

I'm having a bit of trouble correctly displaying a message in a webpage I am trying to create. The code I have is:
content.innerHTML += "<button 'onclick=\"likeFunction(" + feed.messages[y]._id + ")\">" + "Like(" + feed.messages[y].likesCount + ")" + "</button>"
When I inspect the element on the page source, I get this output:
<button 'onclick="like(idOfObject)">Likes(likeNumber)</button>
What I need it to look like is:
<button 'onclick="like("idOfObject")">Likes(likeNumber)</button>
I'm a bit confused on how I would add more single or double quotes and where to escape them correctly to get this desired output.

I think I see a few typos. Most noticeably with the leading ' in front of onclick. I don't think this needs to be here.
As for formatting the string, consider looking into template literals introduced in ES6.
Might look something like this:
content.innerHTML += `<button onclick="likeFunction(${idOfObjectVariable})">Likes (${likeCountVariable})</button>`
Hope this helps

You're so close! First, you need to remove the ' before onclick. If you want to add double quotes around the idOfObject, then you just need escape one double quote after likeFunction( and one double quote before )\">".
"<button onclick=\"likeFunction(\"" + feed.messages[y]._id + "\")\">"
The only problem is that when the double quotes around your variable idOfObject render, they'll correspond to the opening and closing quotes you already have for onclick. So, your solution should have single quotes inside of double quotes:
"<button onclick=\"likeFunction(\'" + feed.messages[y]._id + "\')\">"

I would have guessed what you wanted in your HTML would be:
<button onclick="like('idOfObject')">7</button>
or
<button onclick='like("idOfObject")'>7</button>
You probably do not want to quote the entire on-click attribute, just the part on the right hand side of the = .
content.innerHTML += "<button onclick=\"like('" + feed.messages[y]._id + "')\">" + ...
I'm guessing you also probably don't want something that gets displayed to the user that looks like a function all, but the result of the function call, but that is not what you were asking about.

You SHOULD NOT concatenate html manually from untrusted input (suppose someone injected malicious html code to your feed.messages[y]._id or another field). Sanitization is one of your options but it's like patching a huge hole.
You can read more about preventing those security attacks named XSS here.
Consider creating your DOM manualy with createElement API and bind your event handlers manually.
function renderButton(content, feed, y) {
function likeFunction() {
alert("LIKE" + feed.messages[y]._id);
};
var button = document.createElement("button");
var text = document.createTextNode("Like(" + feed.messages[y].likesCount + ")");
button.appendChild(text);
button.addEventListener('click', likeFunction)
content.appendChild(button);
}
Then you can just render your button with a simple function call.
renderButton(content, feed, 0)

How to call a function with a parameter in ExtJs Row Expander Body?

I have a problem using the Row Expander plugin in ExtJs. What I'm trying to do is call the formatThrottle function and pass the throttleState along with it.
This is one of those silly syntax things, you can see what I'm trying to do but I get a syntax error on the second round bracket, the other lines work perfect and are already in our codebase - hence my next question as I didn't originally develop this:
What is the mechanism called where a parameter value from the current row can be passed to HTML using {}(curly brackets)? Is this a row expander thing or a general JavaScript thing?
EDIT: Fiddle link with the fix for my issue:
https://fiddle.sencha.com/#fiddle/lbn
rowBodyTpl :
'<table><tr>' +
'<td class="TdIndent"/>' +
'<td class="TdItemsWidth">' + formatThrottle( + '{throttleState}' + ) + '</td>' +
'<td class="TdAmountWidth">{throttleReason}</td>' +
'<td class="TdIndent"/>' +
'<td class="TdItemsWidth">{throttleState}</td>' +
'<td class="TdAmountWidth">{throttleReason}</td>' +
'</tr></table>'

You can do something like this:
rowBodyTpl: [
'<table><tr><td>{[this.formatThrottleState(values.id)]}</td></tr></table>', {
formatThrottleState : function(throttleState) {
if(throttleState === 1) {
return "formatted";
} else {
return "not formattted";
}
}
}
]
Hopefully that will help you out.
The function must be passed as part of the template so that it remains within scope.
You might also find something useful in the documentation: http://docs.sencha.com/extjs/4.2.1/#!/api/Ext.XTemplate
As you have it now it is trying to call formatThrottle immediately and the syntax is incorrect. You will want it to run after the actual values have been populated.
The curly brackets will just be replaced using logic within the row expander class.

Javascript DOM onclick

This is fixed! Already have a correct answer.
("<div class='script' onclick='" + 'open_script(' + data + ', ' + data_name_found + ')' + "'>" + data_name_found + "</div> ")
What is wrong with the above code? I am making a project, and am assigning a variable that information to store inside of a div. The variable data is all the data, and data_name_found is the specified name is all the names with other info inside the data variable. The open_script function is supposed to open a div with information about the given script. Sort of like an edit menu, if at all possible, I would prefer not to give out any more code from my project.
Thanks for the help in advance!
EDIT--> The problem is that it won't even trigger the other function. I have been working on this problem for quite a while and can't find out why. May be cause I'm tired, sorry if it's a silly mistake!

It's hard to tell without more code, but the offending piece of code seems to be:
+ 'open_script(' + data + ', ' + data_name_found + ')'
If data and data_name_found are strings, they're being outputted into the HTML without quotation marks. Assuming that's the problem, this should fix it:
+ 'open_script("' + data + '", "' + data_name_found + '")'

changing links doesnt work with jquery

I have got this link:
Visit imLive.com
I want to use this code to add/change different url parameters:
$("a.sitelink_external.imlive").each(function(){
$params=getUrlVars(document.URL);
var promocode_addition='';
if('INFO'==$params['ref']){
promocode_addition='LCI';
}
$(this).attr("href", 'http://im.com/wmaster.ashx?WID=124904080515&cbname=limdeaive&LinkID=701&queryid=138&promocode=LCDIMLRV" + i + promocode_addition+"&"FRefID=" + FRefID + "&FRefP=" + FRefP + "&FRefQS=" + FRefQS');
});
The problem is that that jquery code doesnt work..I tried to move it to document ready..but it doesnt work there too..

The thing that jumps out at me is that you're mixing your double and single quotes on this line:
$(this).attr("href", 'http://im.com/wmaster.ashx?WID=124904080515&cbname=limdeaive&LinkID=701&queryid=138&promocode=LCDIMLRV" + i + promocode_addition+"&FRefID=" + FRefID + "&FRefP=" + FRefP + "&FRefQS=" + FRefQS');
Try changing them all to double quotes, and remove the extra " from after the ampersand in "&"FRefID=" - like this:
$(this).attr("href", "http://im.com/wmaster.ashx?WID=124904080515&cbname=limdeaive&LinkID=701&queryid=138&promocode=LCDIMLRV" + i + promocode_addition+"&FRefID=" + FRefID + "&FRefP=" + FRefP + "&FRefQS=" + FRefQS);
The way you had it was a single string containing stuff that looked like code. The way I've changed it is several strings and variables being concatenated together... (Note the difference with StackOverflow's syntax highlighting.)
Note also that the following code:
$params=getUrlVars(document.URL);
var promocode_addition='';
if('INFO'==$params['ref']){
promocode_addition='LCI';
}
...can be moved to before the .each() loop, since it operates only on the document and thus will produce the same results on every iteration.
(Of course there could be other problems since you reference several variables that aren't shown.)

How to do a Proper Escape of this Function?

I have a DIV tag generated from jQuery that goes like this:
$('#results')
.append('<DIV id='
+ A.pid
+ ' onmouseover=function(){google.maps.event.trigger(marker, 'mouseover');};><H3>'
+ A.name
+ '</H3></DIV>');
Firebug is giving me an error "missing ) argument after list" as it does not recognise the ) immediately after 'mouseover'.
Doing a \'mouseover\' produces a syntax error upon mouseover of the DIV. The syntax error reads: function(){google.maps.event.trigger(marker,
and a look at the generated DIV shows:
<div id="1" 'mouseover');};="" onmouseover="function(){google.maps.event.trigger(marker,">
Doing a "mouseover" produces a blank document.
How do I do a proper escape for this function?
UPDATE:
This should work:
$('#results')
.append('<DIV id='
+ A.pid
+ ' onmouseover=\"function(){google.maps.event.trigger(marker, \'mouseover\');};\"><H3>'
+ A.name
+ '</H3></DIV>');
I need to put escaped double quotes for the function and escaped single quotes for the argument.

You are putting data in JS in HTML in JS in HTML. Every level of encapsulation there requires a string escape, otherwise out-of-band characters will cause errors and possibly security holes. The human brain is not good at keeping track of multiple nested levels of string encapsulation.
So use jQuery's element creation shortcuts to set attributes on the new div, and the event handling features to add the listener to it, instead of messing around with ugly and unsafe HTML string hacking:
var div= $('<div>', {id: A.pid}).append($('<h3>', {text: A.name}));
div.mouseover(function() {
google.maps.event.trigger(marker, 'mouseover');
});
$('#results').append(div);

You need to put " around the values of your html attributes. Otherwise the browser thinks the attribute ends at the next whitespace and that is exactly right after the (marker, part.
$('#results')
.append('<DIV id="'
+ A.pid + '"'
+ ' onmouseover="function(){google.maps.event.trigger(marker, \'mouseover\');};"><H3>'
+ A.name
+ '</H3></DIV>');