html syntax error in jQuery.ajax funciton?

Question

I am manipulating the jSON array in the $.ajax function and i got confused with its syntax. There is a error and can't find it.

 if(value['newVar'] === 1)
              {
              $productContainer.append("<div id='productBox' class='grid_3'>\n\
             <a href='product.jsp?id="+value['id']+"'><img src='"+value["image"]+"'/></a><br/>\n\
             <a href='product.jsp?id="+value['id']+"'><span class='black'>"+value['name']+"</span></a><br/>\n\
             <span class='black'>By "+value['company']+"</span><br/><span class='red'>RS."+value['price']+"</span>\n\
             <br/><br/><a href='#' onclick="foo(this)" pid="+value['id']+">REMOVE</a></div>");

             }

Error is in the if block and in the 4th line after RS."+value['price']+"</span>\n\ it says missing statement Uncaught SyntaxError: missing ) after argument list. I think the error is in the way I have written onclick="foo(this)"

Any help?

if your doing a multiline, concatenate each line.

Roljhon
– Roljhon

2017-04-09 13:55:47 +00:00
Commented Apr 9, 2017 at 13:55 — Roljhon
– Roljhon, Commented Apr 9, 2017 at 13:55
@Roljhon how? `\n` I think this operator is doing it for me

PVP
– PVP

2017-04-09 13:58:22 +00:00
Commented Apr 9, 2017 at 13:58 — PVP
– PVP, Commented Apr 9, 2017 at 13:58
oh sorry, didn't noticed that :)

Roljhon
– Roljhon

2017-04-09 13:59:24 +00:00
Commented Apr 9, 2017 at 13:59 — Roljhon
– Roljhon, Commented Apr 9, 2017 at 13:59

KAD · Accepted Answer · 2017-04-09 13:57:26Z

1

Replace the double quotes with single quotes. You are terminating the string with the double quotes and creating a syntax error:

   ...<a href='#' onclick='foo(this)' pid='"+value['id']+"'>

answered Apr 9, 2017 at 13:57

KAD

11.2k4 gold badges34 silver badges75 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Louys Patrice Bessette · Accepted Answer · 2017-04-09 15:26:47Z

The error was due to a quote misuse on the last line: onclick="foo(this)".
You also had two single quotes missing...
(inside the string somewhere... Not causing the actual error, but you would had some errors in the produced HTML later).

You can use the quote of your choice as the string wrapper to append...
And the other for inside the string.

But you have to watch out for not "mixing" them! One is the string wrapper and the other is part of the string.

if(value['newVar'] === 1){
  $productContainer.append("<div id='productBox' class='grid_3'>\n"+
                           "<a href='product.jsp?id='" +value['id']+ "'><img src='" +value["image"]+ "'/></a><br/>\n"+
                           "<a href='product.jsp?id='" +value['id']+ "'><span class='black'>" +value['name']+ "</span></a><br/>\n"+
                           "<span class='black'>By " +value['company']+ "</span><br/><span class='red'>RS." +value['price']+ "</span>\n"+
                           "<br/><br/><a href='#' onclick='foo(this)' pid=" +value['id']+ ">REMOVE</a></div>");

}

Tricks:

Concatenate your lines using the + sign.
It prevent the inclusion of multiple tabs and spaces inside the string.
It is a better practice than your trailling slash \ at the end of each line.
Make your variables more evident visually, to be able to better see them, like I did above.
It also helps checking for missing or misused quotes.

Collectives™ on Stack Overflow

html syntax error in jQuery.ajax funciton?

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related