Passing string value with return characters to javascript function causes error

Question

The console shows the error 'Uncaught SyntaxError: Unexpected token ILLEGAL' when string values with return characters -as in the example below- are passed to the function in the simplified code below. When a string value without return characters (like 'hello world') is passed the code works fine. I don't understand why and also how to solve this?

simplified function code:

var showSinglePrivateMessage = function(privatemessage,wrapper){

   console.log('showSinglePrivateMessage()-theprivatemessage: '+privatemessage);

}//showSinglePrivateMessage

UPDATE: added the following function that calls showSinglePrivateMessage:

var s_message_private_ref = function(theprivatemessage,wrapper){
  console.log('s_message_private_ref()-theprivatemessage: '+theprivatemessage['postcontent']);   


  var testmessagecontent = theprivatemessage['postcontent'];//'een test message';
  return '<a id="myprivate_s_messagelink" href="#" onclick="userapp.showSinglePrivateMessage(\'' + testmessagecontent + '\',\'' + wrapper + '\');">'+theprivatemessage['postsubject']+'</a>';
}//message_topic_ref

example string value (some Dutch text;-) ) for privatemessage (retrieved from the database):

Beste Marie,

Uit onze administratie blijkt een achterstand van betaling.

Gelieve  het verschuldigde bedrag van 23.12 over te maken binnen uiterlijk 7 dagen.

Met vriendelijke groet,
Mies
Administratie

Can you show where the call to `showSinglePrivateMessage` is made? — Gerben Jacobs, Mar 14 '14 at 12:59
possible duplicate of [Pass a PHP string to a JavaScript variable (and escape newlines)](http://stackoverflow.com/questions/168214/pass-a-php-string-to-a-javascript-variable-and-escape-newlines) — CBroe, Mar 14 '14 at 13:00
Usually the line containing the syntax error is given too. I see no problems with yor code, are you sure this is the right part? What's after that? — MaxArt, Mar 14 '14 at 13:00
I updated the code above with the function that calls showSinglePrivateMessage() — Joppo, Mar 14 '14 at 13:06

score 0 · Answer 1 · answered Mar 14 '14 at 13:57

The problem is that, depending on the content of testmessagecontent, you're generating Javascript code with incorrect syntax. This is usually caused by unescaped content, containing quotes or whatever, so you may resolve with something like this:

return '<a id="myprivate_s_messagelink" href="#" onclick="userapp.showSinglePrivateMessage(\''
       + testmessagecontent.replace(/'/g, "&#39;").replace(/"/g, "&#34;")
       + '\',\'' + wrapper + '\');">' + theprivatemessage['postsubject'] + '</a>';

But I really don't recommend walking this path at all. First of all, you're using traditional event registration. Would it be difficult to make s_message_private_ref return a DOM element instead of a raw HTML string?

Because this would be much cleaner:

var s_message_private_ref = function(theprivatemessage, wrapper) {
    console.log('s_message_private_ref()-theprivatemessage: '
            + theprivatemessage['postcontent']);   

    var testmessagecontent = theprivatemessage['postcontent'], //'een test message'
        anchor = document.createElement("a");

    anchor.id = "myprivate_s_messagelink";
    anchor.href = "#";
    anchor.innerHTML = theprivatemessage['postsubject'];
    anchor.addEventListener("click", function() {
        userapp.showSinglePrivateMessage(testmessagecontent, wrapper);
    });
    return anchor;
}//message_topic_ref

You're maybe using s_message_private_ref to append an element to some container. This way, instead of appending a string (you're not using .innerHTML += ..., don't you? Because DON'T!), you append a DOM element.

Keep in mind that addEventListener isn't supported by IE8 and lower, so you either test for attachEvent or use some framework that does the job for you, like jQuery.

Also, consider event delegation.

Finally, are you sure about assigning a fixed ID to a user generated element?

ok, thanx for the elaborate explenation (!) will give it a try — Joppo, Mar 14 '14 at 14:14

Passing string value with return characters to javascript function causes error

1 Answers1