Escaping special characters for text inputs in a for-loop

Question

I have an array of hashes each comprised of string based key/value pairs. Strangely though I noticed that when the loop complete and if there's an apostrophe within the string, any characters after the apostrophe are omitted (including the apostrophe). For instance if I had a name value Randy's Donuts it would show only as Randy in the input. Is there way I can dynamically escape these apostrophes (let alone any other special characters that I don't know about) within the the loop?

$(function() {
  var brands = [{name: "Randy's Donuts"}, {name: "Joe's American Bar & Grill"}, {name: "Macy's"}];

  for (var i = 0; i < brands.length; i++) {
    var brandName   = "<td><input type='text' value='" + brands[i]["name"] + "'></td>";
    var $tr         = "<tr>" + brandName + "</tr>";
    
    $("table").append($tr);
  }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="">
   <table></table><br />
   <input type="submit" />
</form>

Possible duplicate http://stackoverflow.com/questions/1219860/html-encoding-in-javascript-jquery — KJ Price, Apr 09 '15 at 15:16

score 1 · Accepted Answer · answered Apr 09 '15 at 15:19

The issue is because you need to either escape the ' in the brands which are appended to the string, or change the string delimiters to ' and use " to delimit the attribute values. The latter is much more straight-forward. Try this:

$(function() {
    var brands = [{ name: "Randy's Donuts" }, { name: "Joe's American Bar & Grill" }, { name: "Macy's" }];
    for (var i = 0; i < brands.length; i++) {
        var brandName = '<td><input type="text" value="' + brands[i]["name"] + '"></td>';
        var $tr = "<tr>" + brandName + "</tr>";
        $("table").append($tr);
    }
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form action="">
    <table></table>
    <br />
    <input type="submit" />
</form>

Wow I really hate Javascript string concatenation at times. Thanks for pointing that out. — Carl Edwards, Apr 09 '15 at 15:32

Escaping special characters for text inputs in a for-loop

1 Answers1