plusieurs modals bootstrap - ajax surle bouton supprimer

Bonsoir,

je ne sais pas si j'ai bien compris la problèmatique mais dans ton exemple l'image ne change pas car il s'agit de la "même image" pour le navigateur.

Lorsque que tu cliques sur une image, ton code place l'image situé à http:///truc/200/300/?random dans la popup.
Tu fermes la popup et clique sur une autre image, le navigateur remplace le src par le même lien et du coup considére que l'image n'a pas changé J'ai fait un fork de ton code pour apporter de l'aléa sur le lien de l'image et l'image change bien .

Si je suis complétement à côté de ta question, c'est que j'ai rien compris à ton problème et t'invite alors à préciser ton besoin.

Cordialement

Antho

https://www.bootply.com/Mp1igE5NrP

Bonsoir antho07,

Enfaite ce n'est pas l'image le problème, j'ai mis une image aléatoire, histoire de mettre une image. Dans mon code d'origine, il y a une lecture du dossier pour afficher les images, je ne savais pas quoi mettre dans l'exemple.

Sinon, c'est astucieux ce que tu as fais.

Mais ce n'est pas ce que je recherche. Je vais donc essayer de préciser.

Je souhaite effectuer une action sur le bouton supprimer. J'amerai pouvoir executer un script en ajax qui puisse récupérer le nom de l'image à supprimer et supprimer celle-ci. Le problème c'est que je ne vois pas comment faire.

J'ai rajouté ceci:
<pre><code>
$('#exampleModal').on('hidden.bs.modal', function (e) {
// est-ce que l'utilisateur à cliquer sur le bouton supprimer?
// si oui, récupérer le nom de l'image
// executer un script ajax pour supprimer l'image
console.log(button);
})
</code></pre>

Pour executer le script ajax je sais faire, mais je ne vois pas comment récupérer le nom de l'image quand l'utilisateur clic sur supprimer.

Le fork

En tout cas merci pour ton aide. J'espère que je suis un peu plus précis dans mes propos, désolé ce n'est pas toujours facile à expliquer.

Bonjour.
Tu ne peux pas supprimer un fichier uniquement via de l'ajax, il te faut le faire via le serveur, par exemple :

• Tu récupéres le nom du fichier avec javascript
• Tu transmets le nom du fichier à un script PHP (par exemple)
• Le script PHP fait la suppression du fichier et renvoit des données à ton script javascript pour par exemple qu'il affiche un message à l'utilisateur

N'oublies pas qu'il y a de grosses différences entre ce qui peut être fait par le serveur et le client.

Bonjour Lartak,

Oui, je suis bien concsient des différences entre le client et le serveur, ce n'est pas ma question. Je sais ce que c'est l'Ajax. Mon problème ne porte pas sur la suppression de fichier mais plus sur l'évènement à écouter pour déclencher la requête.

Mon problème est que j'ai des lacunes en javascript qui fait que je ne sais pas récupérer le nom de l'image lorque l'utilisateur clique sur le bouton supprimer.

Merci pour votre aide, je vais continuer à chercher.

EDIT

Humm du coup j'y repense pour l'évènement, il suffit de faire:
<pre><code>
$( "#deleteImg" ).click(function() {
console.log("je clique sur supprimer");
});
</code></pre>

Me reste plus qu'à trouver comment récupérer le nom de l'image.

Je ne sais pas si c'est très propre comme code:
<pre><code>
$( "#deleteImg" ).click(function() {
var img = $('.img-responsive').attr('src')
console.log(img);
});
</code></pre>

Cela me donne bien le nom de l'image dans la console lorsque je clique sur le bouton "supprimer". Je vais vérifier mais c'est sur la bonne voie. Après il y a peut être plus sexy comme code je ne sais pas ^.^ .