Bonjour,
J'ai un problème sur mon formulaire, mon bouton "sauvegarder" n'agit pas sur mon formulaire et je ne comprends pas pourquoi...
Quelqu'un a-t-il une idée pour m'éclairer?
Merci d'avance de votre aide
<?php
$mysqli = new Mysqli("localhost", "root", "", "formulaire_label_drone") or die("Erreur lors de la connexion a la BDD");
//debug($_POST);
//print_r($_POST);
var_dump($_POST);
echo '</br>';
echo '</br>';
var_dump($_FILES);
?>
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Logo </title>
<link rel="stylesheet" href="style.css">
<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css" rel="stylesheet">
<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script>
//-----------------------------------------script logo---------------------------------------//
$(function () {
$('#logo').on('submit', function (e) {
// On empêche le navigateur de soumettre le formulaire
e.preventDefault();
alert('toto');
var $form = $(this);
var formdata = (window.FormData) ? new FormData($form[0]) : null;
var data = (formdata !== null) ? formdata : $form.serialize();
$.ajax({
url: $form.attr('action'),
type: $form.attr('method'),
contentType: false, // obligatoire pour de l'upload
processData: false, // obligatoire pour de l'upload
dataType: 'json', // selon le retour attendu
data: data,
success: function (response) {
$('#result > pre').html(JSON.stringify(response, undefined, 4));
}
});
});
// A change sélection de fichier
$('#logo').find('input[name="my_logo"]').on('change', function (e) {
var files = $(this)[0].files;
if (files.length > 0) {
// On part du principe qu'il n'y qu'un seul fichier
// étant donné que l'on a pas renseigné l'attribut "multiple"
var file = files[0],
$image_preview = $('#image_preview');
// Ici on injecte les informations recoltées sur le fichier pour l'utilisateur
$image_preview.find('.thumbnail').removeClass('hidden');
$image_preview.find('img').attr('src', window.URL.createObjectURL(file));
$image_preview.find('.caption p:first');
}
});
// Bouton "Annuler"
$('#image_preview').find('button[type="button"]').on('click', function (e) {
e.preventDefault();
$('#logo').find('input[name="my_logo"]').val('');
$('#image_preview').find('.thumbnail').addClass('hidden');
});
});
</script>
</head>
<body>
<form id="logo" class="form-horizontal well" method="post" action="#" enctype="multipart/form-data">
<div class="row">
<div class="col-lg-6">
<fieldset>
<legend>Votre logo</legend>
<p>Poster votre logo (png transparent 300/100px)</p>
<div class="form-group">
<label for="contenu" class="col-lg-2 control-label">Parcourir</label>
<div class="col-lg-10">
<input type="file" class="form-control" id="my_logo" name="my_logo" accept="image/*" value="">
</div>
</div>
<div class="form-group" style="margin-bottom: 0;">
<div id="image_preview" class="col-lg-10 col-lg-offset-2">
<div class="thumbnail hidden">
<img src="http://placehold.it/5" alt="">
<div class="caption">
<h4></h4>
<p></p>
<p><button type="button" class="btn btn-default btn-danger">Annuler</button></p>
</div>
</div>
</div>
</div>
</fieldset>
</div>
</div>
<div class="form-group">
<div class="col-lg-10 col-lg-offset-2">
<button type="submit" class="btn btn-primary">Sauvegarder</button>
</div>
</div>
</form>
</body>
</html>