I'm writing a script on Google Script to interact with the Airtable's API.
To ask the API to return a list of records based in a query, they provide the URL to send the post request. However, for the query part of the Url they ask to translate special characters to HTML.
Straight to my question: Is there any cleaner way to code this?
My first solution was to create a dictionary for each character, then run a "replace" method to substitute the special characters to the relative ones on the dictionary.
Any person with a bit more knowledge in Javascript than me? Remembering that I'm running this on Google Scripts.
function urlEncoder(toEncode) {
var dictionary = {
'(':'(',')':')','`':'%60','~':'~','!':'!','#':'%40','#':'%23','^':'%5E','$':'%24','%':'%25','&':'%26',
'*':'*','-':'-','_':'_','=':'%3D','+':'%2B','[':'%5B',']':'%5D','{':'%7B','}':'%7D','\\':'%5C','|':'%7C',';':'%3B',':':':',
'\'':'\'','\"':'\"',',':'%2C','<':'%3C','.':'.','>':'%3E','/':'%2F','?':'%3F',' ':'+',
'à':'%C3%A0','À':'%C3%80','á':'%C3%A1','Á':'%C3%81','â':'%C3%A2','Â':'%C3%82','ä':'%C3%A4','Ä':'%C3%84','ã':'%C3%A3','Ã':'%C3%83',
'è':'%C3%A8','È':'%C3%88','é':'%C3%A9','É':'%C3%89','ê':'%C3%AA','Ê':'%C3%8A','ë':'%C3%AB','Ë':'%C3%8B',
'ì':'%C3%AC','Ì':'%C3%8C','í':'%C3%AD','Í':'%C3%8D',
'ò':'%C3%B2','Ò':'%C3%92','ó':'%C3%B3','Ó':'%C3%93','ô':'%C3%B4','Ô':'%C3%94','ö':'%C3%B6','Ö':'%C3%96','õ':'%C3%B5','Õ':'%C3%95',
'ù':'%C3%B9','Ù':'%C3%99','ú':'%C3%BA','Ú':'%C3%9A','û':'%C3%BB','Û':'%C3%9B','ü':'%C3%BC','Ü':'%C3%9C',
'ç':'%C3%A7','Ç':'%C3%87','ñ':'%C3%B1','Ñ':'%C3%91'
}
var result = toEncode.replace(/[^a-z0-9]/gi, m => dictionary[m])
Logger.log('URL Encoder:'+toEncode+'>>'+result)
return result
}
The string encoder provided by Airtable can be found here: https://codepen.io/airtable/full/rLKkYB
Thanks!
There is no need to make your own function for that, there's already a function called encodeURI in javascript:
var url = "my test.asp?name=ståle&car=saab";
var res = encodeURI(url);
// res = "my%20test.asp?name=st%C3%A5le&car=saab"
I am learning JavaScript and I see %value% in a code but I do not know what does it mean or how to use it. Can anyone please help me explain to me. Thank you very much.
var formattedLocation = HTMLworkLocation.replace("%data%", work.jobs[job].location);
"%data%" is just a literal string. This code will take the value of HTMLWorkLocation, look for the first occurrence of %data% in it, and replace that with the value of work.jobs[job].location, and store the resulting string in formattedLocation.
var work = {
jobs: [{
location: "Home office"
}]
};
var job = 0;
var HTMLworkLocation = "John is located at %data%";
var formattedLocation = HTMLworkLocation.replace("%data%", work.jobs[job].location);
console.log(formattedLocation);
This is probably part of a template system that's used to replace placeholders like %data% with values that come from a table.
You're using string.replace which takes a string or regular expression as it's first argument. Based on the code you posted it looks like you're looking for the string "%data%" (or whatever string you're looking for) in HTMLworkLocation and replacing it with the value in work.jobs[job].location. Then it is being stored in formattedLocation.
I would put a debugger; line after that line of code so you can see what the values are in the debugger console. That might help make more sense of things.
Here is more info on the str.replace method with some examples
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®ion=1%2B4
This is how may API looks like at the moment
MYDOMAIN/path/getRegion?token&profileId=111&dataType=all®ion=1+4
should be the solution
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®ion=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>
Alright, so this is my first answer ever on stack overflow so I'm alien to this whole thing but here we go:
You could try this code in another js file that runs after handlebars:
var pre = $('#pre-region'); // defines a variabe for the element (same as
// document.getElementById('pre-region'))
var retrievedRegion = pre.innerHTML;
var splitten = retrievedRegion.split(',');
var concatenated = parseInt(split[0]) + parseInt(split[1])
retrievedRegion.innerHTML = "'" + concatenated) + "'";
or using replace():
retrievedRegion.replace(',','+')
I have the following string :
[[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],[0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,0,],]
How can I create a 2d array of strings from it ?
EDIT
I've removed html tags since they're not the problem here. Also I'd like to do it without using any additional libs to keep it lightweight.
Except from the HTML tags in it, it would be valid JSON. You could remove the HTML tags and parse it using any library that handles JSON, like jQuery:
var arr = $.parseJSON(theString.replace(/<br\/>/g,''));
It would also be valid Javascript code with the HTML tags removed, so if you have full control over where the string comes from so that you are certain that it can never contain any harmful code, you could use the eval function to execute the string:
// Warning: 'eval' is subject to code injection vulnerabilities
var arr = eval(theString.replace(/<br\/>/g,''));
You will need to remove the <br/> from the string. Then you should be able to do:
var my2darray = eval(mystring);