Trying to append html string fail with jQuery - javascript

I'm trying to append the following string to head with jQuery :
"<script type='text/javascript'> window['adrum-app-key'] = 'dummy';</script>"
But it always fails. Trying to do the same with 'Hello' string for example works as expected.
Following the code snippet I use to append the string :
var integrationScriptTag = handlebars.partials.integration(integrationData);
$(document).ready(function() {
$('head').append(integrationScriptTag.trim());
});
First string is the result of parsing integrationData.
Any help will really be appreciated.
Edit: I realize I misguided some of you with the first string. It is just a representation of what is produced by the first line of the second code snippet. So it doesn't really matter if it is some quote marks or not. The fact is I don't use a literal but rather a variable which is equal to the first string. I corrected the syntax so that there is no more confusion.
Here is the jsFiddle reproducing the problem.
jsFiddle

This should fix it:
'<script type=\'text/javascript\'> window[\'adrum-app-key\'] = \'dummy\';</script>'
or this would too:
'<script type="text/javascript"> window["adrum-app-key"] = "dummy";</script>'
Essentially you have quotes mismatch.

Use this, it will fix the issue
'<script type=\'text/javascript\'> window[\'adrum-app-key\'] =\'dummy\';<\/script>'

I finally found that you cannot append script tags to head with jQuery this way.
I found some solutions here and there (look at the first code snippet of the selected answer for the second link).

The head is parsed prior to the execution of javascript. So you probably have to perform the append outside the $(document).ready function.

Related

JavaScript escape from multiple quotes

I'm basically trying to put this.name instead of "main" tag. Could not find a way to do it on javascript since quotes messes it up.
Code:
document.querySelector('button[name="main"]').classList.add('selected');
try :
document.querySelector('button[name='+this.name+']').classList.add('selected');
Just check
var obj = document.querySelector('button[name="main"]');
alert(obj);
It is working, the problem is in you classlist.add('selected') part

Can I use ui:repeat inside h:outputScript?

Or how would I convert a list of SelectItems to a JavaScript array?
Currently I am trying this:
<h:outputScript>
<!-- Trailing commas valid as per http://www.ecma-international.org/ecma-262/5.1/#sec-11.1.5 -->
var possibleOption = [<ui:repeat value="#{bean.mySelectItems}" var="selectItem">"#{selectItem.value}",</ui:repeat>];
var firstOption = possibleOption[0];
</h:outputScript>
And it works, except that firstOption is undefined although possibleOption gets correctly populated when I check in the console. Maybe a timing problem? Is this even valid JSF, and if so, is there a "blocking" version of ui:repeat or something?
Or which other approach would you recommend?
Aaaah, I got it:
actually I was using:
var chosenOption = '#{empty bean.chosenOption ? possibleOption[0] : bean.chosenOption}';
Which is (now) of course wrong, because I was using possibleOption[0] inside the EL expression headbang
Sorry, one should always post the actual code I guess, not some dumbed down showcase ;)

Javascript Adding variable to code

This might be a really simple issue but I cannot spot the problem.
I have this code:
output += '<li><img src="'+value.thumbnail_url+'" /><h3>'+value.title+'</h3>'+value.body+'</li>';
I need to add this code after the href="#"
and replace the url string with this: value.media_url
I've come up with:
output += '<li><img src="'+value.thumbnail_url+'" /><h3>'+value.title+'</h3>'+value.body+'</li>';
but there seems to be a syntax issue with the above as the link is not working.
The broken code is somewhere here: onclick="window.plugins.childBrowser.showWebPage('+value.media_url+');" as the rest works fine.
I could go even further ... here:
('+value.media_url+')
Can anyone see the problem?
The resulting string is:
window.plugins.childBrowser.showWebPage(my/url/to/file.png)
As you can see, it's missing quotes around the string. Since it's in an attribute, you need this:
... onclick="window.plu.....WebPage("'+value.media_url+'")" ...
replacing onclick="window.plugins.childBrowser.showWebPage('+value.media_url+');" with onclick="window.plugins.childBrowser.showWebPage('"+value.media_url+"');" will fix it

Javascript find and replace string within substring not using jquery

Hi can someone convert this jquery in to plain javascript?
$("body *").each(function () {
$(this).html($(this).html().replace(/\[br\]/\g,'<br/>'));
});
What it does is, it finds all [br] and then replace it with <br/>
The code above works perfectly in chrome but not in mozilla and IE so i need to execute it in plain javascript. many thanks to all!
Try this:
window.onload=function(){
document.body.innerHTML = document.body.innerHTML.replace( /\[br\]/g,'<br/>');
}
ps. In your code, there is a bug: instead of /\[br\]/\g should be /\[br\]/g
The problem was that you had an illegal character in your regular expression.
This works: $(this).html($(this).html().replace(/\[br\]/g,'<br/>'));
Live example: http://jsfiddle.net/tqksm/
the problem is not jQuery. You have first to take a reference to the current html content, then apply the replace and finally inject the new html:
$("body *").each(function () {
var $this = $(this);
var html = $this.html();
$this.html(html.replace(/\[br\]/\g,'<br/>'));
});
I think your missing the point here...rewriting it in plain Javascript is likely to only make it worse for you. One of jQuery's purposes is to take away all the pain that comes while writing Javascript that must work on all browser. So...I think you'd be best off if you start looking for an alternative approach on your jQuery code instead of rewriting it to plain Javascript.

Javascript regex replace between closing and opening tags

I realise this must be a really easy piece of regex, but just can't seem to work it out. I just need to search a string for this:
</p><p>
And add a comma between them, like this:
</p>,<p>
Ignore the fact it isn't nice html, it makes sense to me though!
I tried this, but didn't seem to work:
str.replace(/<\/p><p>/g, "</p>,<p>");
Any ideas? Thanks :)
I tried this, but didn't seem to work:
str.replace(/<\/p><p>/g, "</p>,<p>");
replace returns a new string with the result, it doesn't modify the string you called it on. So that would be:
str = str.replace(/<\/p><p>/g, "</p>,<p>");
// ^^^^^^
This works for me:
alert("Some </p><p> to replace".replace(/<\/p><p>/g, "</p>,<p>"));
Your code works just fine: http://jsfiddle.net/eBkhR/
Strings in javascript are immutable. That is, the contents in a string cannot be modified. Therefore, when using replace method it cannot replace the content but it just returns a new string with the new contents. You would need to store the new string the in required variable.
for example,
str = str.replace(/<\/p><p>/g, "</p>,<p>");
The answers with alert will work because the new string is getting passed to the alert function. The string itself is not modified.
My fault. It does work. I'd forgotten that I have ids in each p tag, so just needed to search for this:
/<\/p><p/g
Thanks for all the replies though!

Categories