Develop Reference

How to replace 'special' characters in a string of code with an expanded piece of that same code?

I'm creating a chrome extension that basically finds a string of text such as this (note the different numbers):
id%22%3A99986%2C%22name%22%3A%22null%22%7D%2C%7B%22id%22%3A1002938%2C%22name%22%3A%22null%22%7D%2C%7B%22
and then usese javascript to swap that text above with this:
id%22%3A77764%2C%22name%22%3A%22null%22%7D%2C%7B%22id%22%3A77984%2C%22name%22%3A%22null%22%7D%2C%7B%22id%22%3A87746%2C%22name%22%3A%22null%22%7D%2C%7B%22
I can't manage to make this work whatsoever. All I'm able to do is swap out the ID numbers and replace individual parts of the code whereas I want to improve it by replacing with larger pieces of code. Can someone help me get past this because I'm confused.
Here is the code that works for me:
document.body.innerHTML = document.body.innerHTML.replace(/99986/g, '77764');
What I'm trying to do is to replace one piece of code with two pieces of code (obviously wrong but it's clear what I'm trying to do):
document.body.innerHTML = document.body.innerHTML.replace(/id%22%3A99986%2C%22name%22%3A%22null%22%7D%2C%7B%22/g, 'id%22%3A77764%2C%22name%22%3A%22null%22%7D%2C%7B%22id%22%3A77984%2C%22name%22%3A%22null%22%7D%2C%7B%22');
Update 1:
Thank you Emeeus, your code worked great! Unfortunately I made an error in my example so I had to fix it up a bit from my end. This is the new code using your layout:
var strA =
"%7Bid%22%3A1001%2C%22name%22%3A%22The+Antique+Store%22%7D%2C%7B%22id%22%3A1010%2C%22name%22%3A%22Clothes%22%7D%2C%7B%22id%22%3A1349%2C%22name%22%3A%22Old+Store%22%7D";
var strB = "%7Bid%22%3A1001%2C%22name%22%3A%22The+Modern+Store%22%7D%2C%7B%22id%22%3A1010%2C%22name%22%3A%22Clothes%22%7D%2C%7B%22id%22%3A1349%2C%22name%22%3A%22New+Store%22%7D";
var arrA = JSON.parse(decodeURIComponent(',{""' + strA + '",:""}'));
var arrB = JSON.parse(decodeURIComponent(',{""' + strB + '",:""}'));
console.log(arrA)
console.log(arrB)
var res = Object.assign(arrA, arrB);
console.log(encodeURIComponent(JSON.stringify(res)))
But I'm met with this error "Error: Unexpected token , in JSON at position 0". Any ideas?

I think you should check if the typeof string you are trying to replace is string. I tested, check if that solves your problem.
See screenshot:

Your strings are parts of a JSON URI-encoded, so I suggest first to decode the strings an then parse them using JSON.parse, then you could work with objects literals, which is easier most of times, here an example:
var strA = "id%22%3A99986%2C%22name%22%3A%22null%22%7D%2C%7B%22id%22%3A1002938%2C%22name%22%3A%22null%22%7D%2C%7B%22";
var strB = "id%22%3A77764%2C%22name%22%3A%22null%22%7D%2C%7B%22id%22%3A77984%2C%22name%22%3A%22null%22%7D%2C%7B%22id%22%3A87746%2C%22name%22%3A%22null%22%7D%2C%7B%22";
var arrA = JSON.parse(decodeURIComponent('[{"' + strA + '":""}]'));
var arrB = JSON.parse(decodeURIComponent('[{"' + strB + '":""}]'));
console.log(arrA)
console.log(arrB)
var res = Object.assign(arrA, arrB);//<-- example
console.log(encodeURIComponent(JSON.stringify(res)))//<-- you could encode the result again

Pentaho Spoon: JavaScript split is only putting one element in array

I have strings in the following format in Pentaho Spoon:
"0.31;0.45"
Now I want these to split in Javascript
var str = "0.31;0.45"
var res1 = str.split(";");
However, this returns an array where only the first element is filled as
res1[0] = "0.310.45"
While I'm expecting this:
res1[0] = "0.31"
res1[1] = "0.45"
What am I doing wrong? I've been looking for quite some time now but didn't discover any solution.
The string has been sanitized before, because it was imported from an excel sheet where enters were added between the different values:
str = strold.replace(new RegExp("\n", "gi"), ";");
Snippet of the excel sheet data can be found here (can't disclose complete records due to the sensitive nature of the data):
Exceldata
Any pointers on the right track will be greatly appreciated :)
Thanks!
Rob

If you want to do this in a Modified JavaScript step, this should word fine:
After Excel-Input of the field test1 with value "0.31;0.45" (as string) your JS-Code should look like this:
var str = test1;
var split = str.split(";");
var res1 = split[0];
var res2 = split[1];
The new fields res1 and res2 now show the splitted values. I think your problem was a missing second variable here like split in my code above, maybe a kettle-specific thing...
As a second possible way to solve this without a JavaScript-Step use the Split-Fields-step:
After Excel input set the step Split-Fields. Here set the field to split (in my testscenario test1), set the delimiter (;) and define the two new fields.
Hope it works!

Javascript/jQuery - Need to find raw text on the page, capture what follows into variable, and replace original with HTML

So let’s say the text KEYWORDANIMAL:(Cat) appears on a page. I want to search through the page for all instances of KEYWORDANIMAL, and then pull the actual animal, in this case Cat, into a variable to be used in another script that’ll pull in related content. I also want to replace KEYWORDANIMAL:(Cat) with an empty div with concatenated ID to be targeted by the other script (this other script is already working fine by itself).
I've been using info from several other threads here but just cannot make it all come together.
-Find text string using jQuery?
-Get text from character and after using jQuery
-How do I use JQuery to replace all occurring of a certain word in a webpage?
Here's what I have so far:
<p>Here is an animal: KEYWORDANIMAL(Cat)</p>
var findString = $('p:contains("KEYWORDANIMAL")').html();
var startIDString = findString.indexOf('(') + 1;
var endIDString = findString.indexOf(')');
var animalID = findString.substring(startIDString, endIDString);
var embedString1 = "<div id=\"";
var embedString2 = "\"></div>";
var embedStringFull = embedString1 + "animal" + animalID + embedString2;
alert(embedStringFull);
findString.each(function () {
var newDIV = $(this).html().replace('KEYWORDANIMAL', embedStringFull);
$(this).html(newDIV);
});
In fiddle form: http://jsfiddle.net/dC6bj/1/
I got the find part down (probably not very efficiently though), but I am clearly missing something on the replace.

If you absolutely have to do this with JavaScript, you can use a regex replacement function:
var animal_regex = /KEYWORDANIMAL\((.*?)\)/g;
$('p:contains("KEYWORDANIMAL")').each(function() {
var $this = $(this);
var html = $this.html().replace(animal_regex, function(match, name) {
return '<div id="animal' + name + '"></div>';
});
$this.html(html);
});
Demo: http://jsfiddle.net/dnuaL/
This should be done serverside, if possible.

For your third question on how toreplace all occurences of a certain word in a webpage use Regex.Replace like this:
var pagecontent = $('body').html();
var newcontent = Regex.Replace(pagecontent , #"[cat]", "dog");
&('body').html(newcontent);
Regex is the fastest solution for this kind of stuff.
My code example is a bit simple, it would also replace ocurrences within a tag.
or within a word for example in catamaran or .
To make it more perfect you could look for cat preceded by a space and followed by a space or a point or a comma. Read some regex tutorials for this. (It's really worth learning, once you know how to, you'll use it a lot)
Goodluck!

Combine two html selections with jquery

Is it possible two combine two html selections in jquery?
var derp1 = $('#derp1').html();
var derp2 = $('#derp2').html();
var combDerp = derp1.add(derp2);
$('#derpina').html(combDerp);
I want to show two certain parts of html into one and display them in another section of the page. Any help is well appreciated :)

Since you are getting the html of each, you can just concatenate the two.
$('#derpina').html(derp1 + derp2);
Or, you can take the actual nodes and move them.
var derp1 = $("#derp1");
var derp2 = $("#derp2");
$("#derpina").html(derp1.add(derp2));

Just change
var combDerp = derp1.add(derp2);
to
var combDerp = derp1 + derp2;

Just concatenate them.
var combDerp = derp1+derp2;

You can also use JQuery .Append() if you are trying to append HTML.
http://api.jquery.com/append/

If you want the elements to move, you should just use:
$('#derp1, #derp2').contents().appendTo('#derpina');
If you want to copy them, you should use:
$('#derp1, #derp2').contents().clone().appendTo('#derpina');

Is it possible to have jQuery do a mathematical calculation from a DIV's numerical content?

I have a DIV that is fed by a server side script that I don't have access too, and it outputs the value in £'s.
HTML Example:
<div id="totalExpenditure">£1,125</div>
I then want to have a jQuery script take that figure and workout the difference between a set value of £2,000 and result it to another DIV.
Which says: <div id="totalSurplus">You have £725 remaining.</div>
I've searched Google for mathmatic jQuery but the results look far too complex. What I'm not sure is even possible is to convert the output of the ID totalExpenditure into the DOM to be manipulated.

1) get the string: var myVal = $('#totalExpenditure').text()
2) Get rid of the non-numeric pound sign: myVal = myVal.replace('£','') and the comma myVal = myVal.replace(',','')
3) turn it into an number: myVal = parseFloat(myVal)
4) Perform any math you want with myVal.
You can do this all in one step, but this gives you an idea of how the language works.

You've got two issues here.
First you need to parse a string and convert it to a number.
Then you need to perform the calculation.
Neither of these are really jquery specific. JQuery can help with getting the string, and writing the output, but the rest is just pure javascript.
var num = parseFloat($("#totalExpenditure").text().replace("£", ""));
var remain = 2000 - num;
var outputStr = "You have £" + remain.toFixed(2) + " remaining";
$("#totalSurplus").text(outputStr);
For more control over the output of the currency perhaps check out this post: How can I format numbers as money in JavaScript?

You are able to feed the value (£1,125) from the server to the client's JavaScript engine the same way you're feeding HTML to the client.
It is really not recommended to read a DOM element for a text node and interpret said node as a value for mathematical operations. You should have a JavaScript variable aside to calculate this for you.

obtain the totalExpenditure div content and set totalExpenditure var value (using a regex):
var content = $('#totalExpenditure').text();
var pattern = /[0-9\.,]/g;
var totalExpenditure = pattern.exec(content);
subtract
var totalImport = 2000;
var result = totalImport - totalExpenditure;