
<link href="http://code.jquery.com/ui/1.10.4/themes/ui-lightness/jquery-ui.css" rel="stylesheet">
<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http://code.jquery.com/ui/1.10.4/jquery-ui.js"></script>

<script>

$(document).ready(function() {
    // Lorsque je soumets le formulaire
    $('#form_upload').on('submit', function(e) {
        e.preventDefault(); // J'empêche le comportement par défaut du navigateur, c-à-d de soumettre le formulaire
 
	//	var file = _("fileToUpload").files[0];
	// alert(file.name+" | "+file.size+" | "+file.type);
	//	var sample = document.getElementById("fileToUpload").files[0];
		
	//	alert(sample);
		
	//	var fichier = $('#fileToUpload').val();
		
	//	var form = $('form_upload')[0]; // You need to use standart javascript object here
	//	var formData = new FormData(form);
	//	alert(formData);
	
	
	    var file = this.files[0];
    var name = file.name;
    var size = file.size;
    var type = file.type;
	
	alert(name + size + type);

  var formData = new FormData($('form_upload')[0]);		
	alert(formData);
	  //var $form = $('#form_upload');
	  //var data = new FormData($form[0]);
  
		if(fichier == '')
		{
			
					$( "#message_erreur" ).dialog({
													modal: true,
													title: "Infos",
													buttons: {
																Ok: function()
																{
																	$( this ).dialog( "close" );
																}
															 }
													});

			
			
        }
		else
		{
				//var data = 'nom_fichier='+fichier;
                   var dados = $( form_upload ).serialize(); 

				$.ajax({
							
							type: "POST",
							url: "traitement_upload.php", 
							data: dados,
							contentType:attr( "enctype", "multipart/form-data" ),
							success: function (reponse) 
							{
									alert(reponse);
									
							},
							
							error : function(request)
							{
									console.log(request.responseText);
							}
				});

		
		
		
		}
					
/*

var formData = new FormData();
formData.append("thefile", file);
xhr.send(formData);

puis $_FILES['thefile'] 

ocument).ready(function(){
        document.getElementById('upload').addEventListener('change', function(e) {
            var file = this.files[0];
            var xhr = new XMLHttpRequest();
            xhr.file = file; // not necessary if you create scopes like this
            xhr.addEventListener('progress', function(e) {
                var done = e.position || e.loaded, total = e.totalSize || e.total;
                console.log('xhr progress: ' + (Math.floor(done/total*1000)/10) + '%');
            }, false);
            if ( xhr.upload ) {
                xhr.upload.onprogress = function(e) {
                    var done = e.position || e.loaded, total = e.totalSize || e.total;
                    console.log('xhr.upload progress: ' + done + ' / ' + total + ' = ' + (Math.floor(done/total*1000)/10) + '%');
                };
            }
            xhr.onreadystatechange = function(e) {
                if ( 4 == this.readyState ) {
                    console.log(['xhr upload complete', e]);
                }
            };
            xhr.open('post', url, true);
            xhr.setRequestHeader("Content-Type","multipart/form-data");
            xhr.send(file);
        }, false);
    });

*/
		
		//$("#bar").width(percentComplete+'%');
        //$("#percent").html(percentComplete+'%');
 
		
 /*
        var $this = $(this); // L'objet jQuery du formulaire
 
        // Je récupère les valeurs
        var pseudo = $('#pseudo').val();
        var mail = $('#mail').val();
 
        // Je vérifie une première fois pour ne pas lancer la requête HTTP
        // si je sais que mon PHP renverra une erreur
        if(pseudo === '' || mail === '') {
            alert('Les champs doivent êtres remplis');
        } else {
            // Envoi de la requête HTTP en mode asynchrone
            $.ajax({
                url: $this.attr('action'), // Le nom du fichier indiqué dans le formulaire
                type: $this.attr('method'), // La méthode indiquée dans le formulaire (get ou post)
                data: $this.serialize(), // Je sérialise les données (j'envoie toutes les valeurs présentes dans le formulaire)
                success: function(html) { // Je récupère la réponse du fichier PHP
                    alert(html); // J'affiche cette réponse
                }
            });
        }*/
    });
});

</script>

			<form id = "form_upload" action="debug_upload.php" method="post" enctype="multipart/form-data">
			Selection d'un document:
			<input type="file" name="fileToUpload" id="fileToUpload">
			<br>
			<input type="submit" value="Upload" name="submit">
			</form>
			
			
			<div id="message_erreur" style="display: none">
			<p>
			<span class="ui-icon ui-icon-circle-check" style="float:left; margin:0 7px 50px 0;"></span>
			Champs obligatoire(s) vide !.
			</p>
			</div>

