CODEWITHSUNDEEP
javascriptjqueryajax
tabia
tabia

Reputation: 635

Uncaught TypeError: Illegal invocation error while sending data from ajax

i have a form which i am trying to send values through ajax. But i receive following error:

Uncaught TypeError: Illegal invocation

I am stuck and can't find where am i wrong. Any suggestions please?

Ajax

<html>
<head>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" </script>
<script type="text/javascript">
$(document).ready(function() {
$("#submit_custom").click(function() {
 e.preventDefault();
var postData = new FormData();
  postData.append('file[]', $('input[type=file]')[0].files[0]); // after this line
  postData.append('trxid', $('input[name=trxid]'));
  postData.append('orderid', $('input[name=orderid]'));
  postData.append('custid', $('input[name=custid]'));
  if(proceed)

 $.post('upload.php', post_data, function(response){
 if(response.type == 'error'){ //load json data from server and output message
  output = '<div class="error">'+response.text+'</div>';
  }else{
  output = '<div class="success">'+response.text+'</div>';
  $("#upload_form").slideUp(); //hide form after success
                    }
  $("#upload_form").hide().html(output).slideDown();
  }, 'json');
  });
  });
  });
    </script>
</head>
<body>
<h2>Hello <?php echo $user ?> </h2> <p> "You have successfully done purchasing process.</p>
<div id="upload_form">
<p>To send your size details for your order please upload the following file:</p>
<p>Download custom size form Provide us your custom size: <a  href="download.php?download_file=custom-measurement-form.pdf">File.pdf</a></p>
<form enctype="multipart/form-data" action="" method="post">
    <input type="text" name="trxid" value="<?=$trx?>">
    <input type="text" name="orderid" value="<?=$orderid?>">
    <input type="text" name="custid" value="<?=$customerid?>">
    <input type="file" name="file">
    <input type="submit" id="submit_custom">
</form>
</div>
</body>
</html>

Upvotes: 2

Views: 2514

Answers (1)

nnunes10
nnunes10

Reputation: 550

You are getting Illegal invocation because jQuery can't serialize the postData object for $.post.

I think you need to add .val(). 

postData.append('file[]', $('input[type=file]')[0].files[0].val()); // after this line
postData.append('trxid', $('input[name=trxid]').val());
postData.append('orderid', $('input[name=orderid]').val());
postData.append('custid', $('input[name=custid]').val());

Upvotes: 1

Related Questions