Bonjour,

Tout d'abord, merci pour le contenu de ce site internet, de par ses tutoriels et contributions productives.

Je m'initie à jquery et ajax.

J'ai une liste d'elements affichés dans un tableau html, avec pour chaque ligne, dans une cellule, un lien a href associé à une classe renvoyant une fonction "delete" qui a pour but de supprimer dynamiquement la ligne (effacement graphique dans la page et appel d'un script php pour la suppression dans la base de données).

Tout marche bien (effacement graphique avec effets, suppression dans la base de données), sauf que cela déclenche à chaque fois un déplacement en début de page et non laisser la page au niveau de sa position (scroll) du navigateur internet. C'est à dire que si mon tableau est long (nécessite de défiler avec le scroll du navigateur pour atteindre la ligne souhaitée, ... donc début de page qui n'est plus visible... Le clic déclenchant le "delete" ramène en début de page)

Est-ce normal ? Si oui, comment alors obtenir ce que je souhaite réaliser ?

D'avance, merci

Extrait de mon code :

        <script src="./lib/jquery-3.2.1.min.js" type="text/javascript"></script>

        <script type="text/javascript">
            $(function() 
            {
                $(".delete").click(function()
                {
                    var element = $(this),del_id = element.attr("id"),del_name = element.attr("name"),info = {id : del_id };

                    if(confirm("Etes-vous sûr de vouloir effacer : " + del_name  +" ?"))
                    {
                        $.ajax({
                            url: "supprimer.php",
                            type: "GET",
                            data: "id=" + del_id,
                            success : function()
                                {
                                    element.parents(".show").animate({ backgroundColor: "#003" }, "fast").animate({ opacity: "hide" }, "fast");

                                }
                        });
                    }
                });
            });
    </script>

2 réponses


Kenor
Réponse acceptée

Je ne vois pas dans ton code "l'arrêt du click" ?

$(".delete").click(function(e) {
       e.preventDefault();
       // etc.
 }

Ton soucis ne viendrait pas plutôt du fait qu'il recharge la page en question (plutôt que de remonter). Dans ton code, en tout cas ce que tu nous montres, rien n'explique une remontée de la page.

Merciu Kenor, c'était tout simplement celà.

En apportant ta modification suggérée, le problème est résolu. Il n'y a plus la "remontée".