Fonction

Pour toutes les discussions javascript, jQuery et autres frameworks
Répondre
Gad
Messages : 2
Enregistré le : 04 mars 2021, 17:38

Fonction

Message par Gad » 04 mars 2021, 18:05

Bonjour,

J'utilise le code JS ci-dessous pour passer en POST un formulaire puis charger le PHP du résult dans une DIV.
Le script fonctionne très bien pour tous les type de données (text, select...) mais ne fonctionne pas pour un type FILE...
Quelqu'un aurait-il une idée ?
Merci d'avance.

Code : Tout sélectionner

<div class='row'>
	<div class='col-md-12' style='text-align:left;margin-top:20px;'>
		<form id='form_dedup'>
			<div class="form-group">
				<label class="form-control-label" for="file_dedup">Dédoublonner le comptage</label>
				<input type="file" class="form-control-file" name="file_dedup">
			</div>
			<div id='div_retour_dedup'>
			</div>
		</form>
	</div>
	<div class='col-md-6' style='text-align:left;margin-top:5px;'>
		<button type='button' class='btn btn-warning' id='btn_dedup'>Dédoublonner le comptage</button>
	</div>
	<script>
	$(function() { 
		$("#btn_dedup").click(function() { 
			$.post("interface_comptage_dedoublonnage.php", $("#form_dedup").serialize()) 
			.done(function(data) { 
				$("#div_retour_dedup").html(data); 
			}); 
			document.getElementById("div_retour_dedup").innerHTML = "<div class='spinner-border text-info' style='width: 3rem; height: 3rem; margin-top:20px;' role='status'><span class='sr-only'>Loading...</span></div>";
		});
	});
	</script>
</div>

Avatar du membre
webmaster
Administrateur du site
Messages : 563
Enregistré le : 28 févr. 2017, 15:19

Re: Fonction

Message par webmaster » 04 mars 2021, 19:06

Bonjour

Il faut sans doute ajouter enctype="multipart/form-data" dans la balise form

un exemple d'upload de fichier ici :
https://www.toutjavascript.com/livre/sc ... url=upload
TJS : 25 ans et mon livre Tout JavaScript chez Dunod
https://www.toutjavascript.com/livre/index.php

Gad
Messages : 2
Enregistré le : 04 mars 2021, 17:38

Re: Fonction

Message par Gad » 05 mars 2021, 08:52

Merci pour l'aide mais cela ne fonctionne pas...
La fonction serialize() ne prend pas en compte les input type file.
J'ai cependant trouvé une solution.
Je met le code ci-dessous si cela peut aider quelqu'un !

Code : Tout sélectionner

<div class='row'>
	<div class='col-md-12' style='text-align:left;margin-top:20px;'>
		<form>
			<div class="form-group">
				<label class="form-control-label" for="file_dedup">Dédoublonner le comptage</label>
				<input type="file" class="form-control-file" id="file_dedup" name="file_dedup">
			</div>
			<div id='div_retour_dedup'>
			</div>
		</form>
	</div>
	<div class='col-md-6' style='text-align:left;margin-top:5px;'>
		<button type='button' class='btn btn-warning' id='btn_dedup'>Dédoublonner le comptage</button>
	</div>
	<script>

$("#btn_dedup").click(function(){
	
	var fd = new FormData();
	var files = $('#file_dedup')[0].files;
	
	fd.append('file_dedup',files[0]);

	$.ajax({
		url: 'interface_comptage_dedoublonnage.php',
		type: 'post',
		data: fd,
		contentType: false,
		processData: false,
		success: function(data){
			$("#div_retour_dedup").html(data);
		}
	});
});
	</script>
</div>

Répondre