CODEWITHSUNDEEP
jquery
user2922439
user2922439

Reputation: 23

upload file after selecting file

i have this form which is appended onclick of a div

$('#div').click(function(){
   $('#div').load('form.php');
});

here is the form appended

    <form id="addpic" name="addpic" method="post" enctype="multipart/form-data" action="docupload.php">
      <input type="file" name="mfoni" id="upper1" style="height:10px; width:100px; cursor:hand;" />
      <input type="hidden" name="user" value="<?php echo $id; ?>" id="user" />
   </form>

now i want to submit the form without refreshing the page or redirecting with the code below

$("input#upper1").live('change', function(){
       alert("gone");
       // works up to this point
       $("form#addpic").ajaxForm({
         target: '#loading'
      }).submit();
    })

this works up to the alert('gone') point and it stops please healp me out

Upvotes: 0

Views: 3850

Answers (1)

Siva Charan
Siva Charan

Reputation: 18064

It looks like you are missing below external JS file reference

http://malsup.github.com/jquery.form.js

The other thing is you need to use .on() rather than using .live(). Since live() method has been deprecated in jQuery 1.7.

You no need to use ajaxForm() and .submit(). Just use ajaxSubmit().

JS Code:

$("input#upper1").on('change', function(){
    alert("gone");
    $("form#addpic").ajaxSubmit({
        type: "post",
        success: function() {
            alert("Processed");
        },
        complete: function() {
            alert("File upload is completed");
        }
    });
});

Refer LIVE DEMO

Upvotes: 1

Related Questions