jQuery/Ajax Submit file to url localhost

Question

I have a page on my localhost that contains an input type file and a submit button.

From this page I can upload files.

It looks like this:

<form>
  <input type="file">
  <input type="submit" value="Submit">
</form>

This page is on url: http://127.0.0.1/upload.html

What I want to do is to have my index.html submit a file to this location like having something like this:

<form action="http://127.0.0.1/upload.html"> etc...

But I want to use Javascript.

How can I do this?

Possible duplicate of [jQuery Ajax File Upload](https://stackoverflow.com/questions/2320069/jquery-ajax-file-upload) — Konstantinos, Apr 03 '18 at 20:03

score 1 · Accepted Answer · edited Apr 03 '18 at 20:27

If you want an action to take place when the submit button is clicked, your jQuery will need to refer to this action, then use ajax to load up the new page.

Below is an example code for your JS:

 $(document).ready(function() {
    $('form').submit( function() {
        $.ajax({
            type: 'post',
            url: 'upload.html',
            data:{file},
            success: function (data) {
                alert("done")
            }
        })
    })
})

jQuery/Ajax Submit file to url localhost

1 Answers1