How to escape the apostrophe in javascript

Question

When I select a name from dropdown where it has an apostrophe Example: Brian O'Connar

My JS code will bring Brian O and rest of the characters after apostrophe gets cuts.

My Original JS code to load the data --

else if(newClaimCols[key]== "assigned_to_full_name_primary") {
  var selectedText =$("#claim" + newClaimCols[key] + "filter").val() 
  //Brian O

  if (selectedText!==null && selectedText!=="" ) {
    var temp1 = $("#claim" + newClaimCols[key] + "filter").val();
    for (var key in temp1) {
      temp.push(temp1[key]);
    }
  }
}

In above case .val() selects only the text before apostrophe

2nd case I tried .text() please refer below code

else if (newClaimCols[key] == "assigned_to_full_name_primary") {
  var selectedText = $("#claim" + newClaimCols[key] + "filter option:selected").text();//Brian O'Connar
  if (selectedText!==null && selectedText!=="" ) {
    var temp1 =$("#claim"+newClaimCols[key]+ "filter option:selected").text();
    temp.push(temp1);
  }
}

In this case i am getting Brian O'Connar but if i select multiple names Brian O'Connar and Nishinoya'O in dropdown it comes like

Example: Brian O'ConnarNishinoya'O

not sure how to handle this.

Please let me know how can i completely load the name with the apostrophe or a solution for 2nd case .text() when multiple name gets selected.

It's unclear why your first `.val()` is giving truncated values - most likely your HTML is malformed. — freedomn-m, Jun 20 '23 at 07:20
Using `.text()` on multiple elements (in your case multiple ` — freedomn-m, Jun 20 '23 at 07:22
Please provide enough code (HTML) to be able to determine the cause of your first issue. `.val()` should return multiple values in an array. See [mcve]. — freedomn-m, Jun 20 '23 at 07:22
Thanks https://stackoverflow.com/users/2181514/freedomn-m I got an idea that my HTML was wrong not js — Nilanshu Vishesh, Jun 20 '23 at 07:56

CaptainObvious · Answer 1 · 2023-06-20T06:26:08.380

0

To properly handle the apostrophe and preserve the complete name, you can use JavaScript's encodeURIComponent() function to encode the selected text before pushing it into the temp array. This will ensure that the apostrophe (and any other special characters) are correctly escaped. By encoding the selected text using encodeURIComponent(), you can safely pass it as a parameter or store it in an array without any issues. When you need to use the value later, you can decode it using decodeURIComponent().I added it to the code, I hope this solves your problem.

else if (newClaimCols[key] == "assigned_to_full_name_primary") {
  var selectedText = $("#claim" + newClaimCols[key] + "filter option:selected").text();
  if (selectedText !== null && selectedText !== "") {
    var temp1 = $("#claim" + newClaimCols[key] + "filter option:selected").text();
    temp.push(temp1);
  }
}

edited Jun 20 '23 at 06:26

answered Jun 20 '23 at 05:52

CaptainObvious

99
5

var temp1 =$("#claim"+newClaimCols[key]+ "filter option:selected").text(); this line is already picking up the name with escape character but when multiple names are selected Example-- Brian O'Connar and Nishinoya'Shoyo then result would be Brian O'ConnarNishinoya'O this was the 2nd case i mentioned , do you have anything in your mind where i can get multiple names gets with space or any other character. – Nilanshu Vishesh Jun 20 '23 at 06:19
In that case, you can directly push the temp1 value into the temp array without any modifications, updated code in my initial response – CaptainObvious Jun 20 '23 at 06:25
temp1=Brian O'ConnarNishinoya'O has two names mergerd together how can i split it?? i need two names separated as Brian O'Connar Nishinoya'O – Nilanshu Vishesh Jun 20 '23 at 06:30
have you tried using ```split()``` with a delimiter? – CaptainObvious Jun 20 '23 at 06:34

score 0 · Answer 2 · answered Jun 20 '23 at 07:54

I cleaned up my HTML option tag from this

optstring += "<option value='" + key +'='+  val + "'>" +val+ "</option>";

to this

optstring += '<option value="' + key +'='+  val + '">' +val+ "</option>";

Now the value from html i am getting to JS is accepting apostrophe

How to escape the apostrophe in javascript

2 Answers2