Uploading a video using ajax

Question

To upload a video using the functionality of the ajax, what do I need to put inside the data field of ajax function?

<input type='file' accept='video/*' /> 
<button type="submit" class="btn btn-default" id='uploadmatch'>upload</button>

$('#uploadmatch').click(function(event) {
                event.preventDefault();
                $.ajax( {
                    url : 'http://localhost:8081/Football/UploadMatch',
                    type : 'POST'
                    data : {}
                })
                  .done(function(message) {

                  });
});

Answer 1

You can use FormData to send your data like image, video or any other file, and in the server work with it like a $_FILES to access your files.

In the following code movieFormData is my form id

function movieMaker(){    
  var form = new FormData($('#movieFormData')[0]);  
  // Make the ajax call
  $.ajax({
      url: 'ajaxcontrol/movieMaker.php',
      type: 'POST',   
      success: function (res) {
         // your code after succes
      },      
      data: form,                
      cache: false,
      contentType: false,
      processData: false
  });  

}

By doing this, what ever there is in your form tag like data in input type='file' will be available in the server, and you can save your video or do what ever you want to do with it.

And be sure to give your input a name so you can access it by;

$file = $_FILES["youInputName"];