How can I upload files asynchronously with jQuery

0 votes

I would like to upload a file asynchronously with jQuery.

$(document).ready(function () {
    $("#uploadbutton").click(function () {
        var filename = $("#file").val();

        $.ajax({
            type: "POST",
            url: "addFile.do",
            enctype: 'multipart/form-data',
            data: {
                file: filename
            },
            success: function () {
                alert("Data Uploaded: ");
            }
        });
    });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.0/jquery.min.js"></script>
<span>File</span>
<input type="file" id="file" name="file" size="10"/>
<input id="uploadbutton" type="button" value="Upload"/>

 

Instead of the file being uploaded, I am only getting the filename. What can I do to fix this problem?

Jun 10, 2022 in JQuery by gaurav
• 23,260 points
730 views

No answer to this question. Be the first to respond.

Your answer

Your name to display (optional):
Privacy: Your email address will only be used for sending these notifications.
0 votes

Steps to run the Program:

  1. Create a folder upload in the xampp/htdocs directory.
  2. Copy and edit the html/jQuery code as per requirement.
  3. Create a file upload. ...
  4. Start the Apache server and open the html file using browser.
  5. Select any text or image file and click on Upload button
answered Jun 10, 2022 by rajatha
• 7,680 points

edited Mar 5

Related Questions In JQuery

0 votes
1 answer

How can I upload files asynchronously?

Hello @kartik, Using JavaScript code you can do it ...READ MORE

answered Sep 10, 2020 in JQuery by Niroj
• 82,840 points
817 views
0 votes
1 answer

How can I refresh a page with jQuery?

Hello @kartik, Use location.reload(): $('#something').click(function() { location.reload(); }); The reload() function ...READ MORE

answered Sep 10, 2020 in JQuery by Niroj
• 82,840 points
2,300 views
0 votes
1 answer

How can I select an element with multiple classes in jQuery?

Hello @kartik, If you want to match only ...READ MORE

answered Sep 10, 2020 in JQuery by Niroj
• 82,840 points
3,671 views
0 votes
1 answer

How can I refresh a page with jQuery?

Use the JavaScript location. reload() Method You can simply ...READ MORE

answered Jun 10, 2022 in JQuery by gaurav
• 23,260 points
1,186 views
0 votes
1 answer

How can I Validate forms with jquery?

Then to define rules use simple syntax. ...READ MORE

answered Jun 1, 2022 in JQuery by Edureka
• 13,690 points
628 views
0 votes
1 answer

How can I remove an attribute with jQuery?

The removeAttr() method is an inbuilt method in jQuery ...READ MORE

answered Jun 2, 2022 in JQuery by Edureka
• 13,690 points
9,828 views
0 votes
1 answer

jQuery AJAX submit form

There is a simple input mentioned below ...READ MORE

answered Feb 8, 2022 in Java by Soham
• 9,710 points
1,894 views
0 votes
1 answer

Abort Ajax requests using jQuery

Instead of aborting, you can choose to ...READ MORE

answered Jun 16, 2022 in JQuery by rajatha
• 7,680 points
890 views
0 votes
0 answers

Fetch data from database in php through AJAX,

The index.php  I created a connection with the ...READ MORE

Jun 16, 2022 in PHP by narikkadan
• 63,600 points
8,470 views
0 votes
1 answer

How to generate a simple popup using jQuery

To create a popup, add the data-role="popup" ...READ MORE

answered Jun 17, 2022 in JQuery by rajatha
• 7,680 points
3,097 views
webinar REGISTER FOR FREE WEBINAR X
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP