dynamically generated form in jquery does not call function on onchange

Question

Sorry to bother you but I can't figure out why the function "fileUpload()" isn't being called when the input button is clicked.

I've isolated the problem to the dynamically generated form-- the fileUpload() works when the form is already loaded on the page.

Here is the code:

var dID;
var pictureform;


$(document).delegate('.ddxaddpic', 'click', function(){
        dID = $(this).prev('.diffddz').find('option:selected').val();
        var n =$('this span.addhere form').length;

        if ((dID !== "") && (n == 0)) {

        pictureform = "<form id='picup"+dID+"' class='picupcl' enctype='multipart/form-data'>"
        pictureform += "<input type='file' id='inp1'  name='fileToUpload"+dID+"[]' onchange='fileUpload('picup"+dID+"','pictureupload.php','upload"+dID+"','picup"+dID+"');'/></br>"
        pictureform +="<input type='hidden' name='filenum' value='"+dID+"'/><input type='hidden' name='clinimg_id' value='"+dID+"'/></form>"
        pictureform +="<span id='upload"+dID+"'></span>";

        $(this).next('.addhere').append(pictureform);


        }

        });

When I click to upload files, the function never gets called. Worse, I also receive a syntax error "Uncaught SyntaxError: Unexpected token } " at a line that doesn't have any code.

Any tips?

Thank you so much for your help.

Answer 1

I see at least a quote problem here ...

// replace
pictureform += "<input type='file'...
// by 
pictureform += "<input type='file' id='inp1'  name='fileToUpload"+dID+"[]' onchange=\"fileUpload('picup"+dID+"','pictureupload.php','upload"+dID+"','picup"+dID+"');\"/></br>";

Plus add semicolon at the end of instructions, it will keep some syntax error risks away