apple .replace() Html element generate by handlebar js

Question

I am wondering if how am i able to change the element data by .replace() if i use handlebar js to generate html elements.

For instance i have this role of p tag which display a row of data by handlebar js:

<p id="pre-region">{{region}}</p>

and the result of it is

1,44

and i 'd like to change it to

1+44

If you haven't had any experience of handlebar js then consider the tag be

 <p id="pre-region">1,44</p>

how should i change from 1,44 to 1 +44?

UPDATE 1

Here should be an extersion for my question. I am passing the HTML element inside pre-region into an href in order to update my website by Ajax.

After i have converted all the comma in to "+" the API retrieve special character "&B2" which equal to the symbol "+" and the API goes error.

MYDOMAIN/path/getRegion?token&profileId=111&dataType=all&region=1%2B4

This is how may API looks like at the moment

MYDOMAIN/path/getRegion?token&profileId=111&dataType=all&region=1+4

should be the solution

Answer 1

I haven't had any experience of handlebars.js but from my point of view, you can just put the code just before the </body>:

<script>
  var node = document.getElementById('pre-region');
  node.innerHTML = node.innerHTML.replace(',', '+');
</script>

I'll check out the handlebars js in case it does not work.

Update: As you mentioned in the comment, if you need to use it in the HTTP request/URL, you may handle the string using decodeURIComponent(yourstring):

decodeURIComponent('1%2B44'); // you get '1+44'

Read more about decodeURIComponent() method from this. In URL, it should be encoded as region=1%2B44 in your case; while it should be decoded if you want to use it in your JavaScript code or display in the web page.

Update 1

You should encode your string when it's used as a part of parameter of HTTP request. Therefore, it looks good if the URL is:

MYDOMAIN/path/getRegion?token&profileId=111&dataType=all&region=1%2B4

What you need to do is decode the string on your server side. I assume that you are in control of the server side. If you are using Node.js, you can just use decodeURIComponent() method to decode the parameter. If you're using Python or PHP as your server language, it should be something like decodeURIComponent() in that language.

Update 2

The solution above only replace the first occasion of comma to +. To solve that, simply use:

<script>
  var node = document.getElementById('pre-region');
  node.innerHTML = node.innerHTML.replace(/,/g, '+'); 
  // Regular Expression is used here, 'g' for global search. 
</script>

PHP has a replaceAll() method, so we can add that method to String.prototype like below if you want:

<script>
  String.prototype.replaceAll = function(search, replacement) {
    var target = this;
    return target.split(search).join(replacement);
  }
  // Another method to replace all occasions using `split` and `join`. 
</script>