I keep getting a unterminated string literal error

Question

It keeps giving me a unterminated string litereral error below but I can't see the problem. How can it be fixed below:

 var $fileImage = $("<form action='upload.php' method='post' enctype='multipart/form-data' target='upload_target' onsubmit='startUpload();' >
    <p class='f1_upload_process'>Loading...<br/><img src='Images/loader.gif' /><br/></p><p class='f1_upload_form'><br/><label>
    File: <input name='fileImage' type='file' class='fileImage' /></label><label><input type='submit' name='submitBtn' class='sbtn' value='Upload' /></label>
    </p> <iframe class='upload_target' name='upload_target' src='#' style='width:0;height:0;border:0px solid #fff;'></iframe></form>");

$image.append($fileImage);

Answer 1

JavaScript is not PHP. Linebreaks are not permitted within a string.

Add \ at the end of each line, or concatenate the string using " + " .

// Using \, scroll to the right to see how to use it
var $fileImage = $("<form action='upload.php' method='post' enctype='multipart/form-data' target='upload_target' onsubmit='startUpload();' >\
    <p class='f1_upload_process'>Loading...<br/><img src='Images/loader.gif' /><br/></p><p class='f1_upload_form'><br/><label>\
    File: <input name='fileImage' type='file' class='fileImage' /></label><label><input type='submit' name='submitBtn' class='sbtn' value='Upload' /></label>\
    </p> <iframe class='upload_target' name='upload_target' src='#' style='width:0;height:0;border:0px solid #fff;'></iframe></form>");

// Using string concatenation
var $fileImage = $("<form action='upload.php' method='post' enctype='multipart/form-data' target='upload_target' onsubmit='startUpload();' >" + 
    "<p class='f1_upload_process'>Loading...<br/><img src='Images/loader.gif' /><br/></p><p class='f1_upload_form'><br/><label>" + 
    "File: <input name='fileImage' type='file' class='fileImage' /></label><label><input type='submit' name='submitBtn' class='sbtn' value='Upload' /></label>" +
    "</p> <iframe class='upload_target' name='upload_target' src='#' style='width:0;height:0;border:0px solid #fff;'></iframe></form>");

Since you're using jQuery , I recommend create readable and maintainable code by using jQuery:

var $form = $('<form>', {
    action: 'upload.php',
    method: 'post',
    enctype: 'multipart/form-data',
    target: 'upload_target'
}).submit(startUpload);
// Et cetera.