Discussion :

[lebuttazzoni]

Bonjour,

j'ai créé un script pour effacer une ligne de mon tableau quand je clique sur un lien. Une partie en javascript ( via jquery) efface la ligne dans le navigateur et la requête ajax l'efface de la BDD.

Quand je teste avec la requête javascript/jquery seule ça efface bien la ligne dans le navigateur. Mais quand j'ajoute la requête AJAX pour l'effacer dans la BBD aussi, la ligne ne s'efface plus ( mais elle supprimé de la BDD) ( sous firefox et chrome idem. C'est mon premier script ajax / javascript, j'ai du faire une erreur toute bête. voici le script

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
function deleteMe(row_id, tableid) {
    if (!confirm('Supprime ' + row_id + ' de ' + tableid + ' ?')) {
        ev.preventDefault();
        return false;
    } else {
        $('#' + tableid + ' #my_row_' + row_id).remove();
        var dileteobject = null;
        dileteobject = new XMLHttpRequest();
        dileteobject.open("GET", "action.php?row_id=" + row_id + "&tableid=" + tableid, false);
        dileteobject.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
        dileteobject.send(null);
        if (dileteobject.readyState == 4) {
            alert("effacé de la table");
        }
    }
}

Note : on envoie un row_id aka le numéro de la ligne et tableid aka le nom du tableau

Merci à ceux qui auraient un conseil

[sekaijin]

tu utilise JQuery pourquoi ne pas utiliser les méthode de JQuery pour faire ton appel AJAX ??

ensuite il y a une chose d'incohérente dans ta façon de faire
tu supprime la ligne du tableau sans savoir si elle a pu être supprimé dans la table

perso sur la confirmation de l'utilisateur j'enverrais la requête AJAX et si le serveur réponds qu'il l'a effectivement supprimée dans la callback je supprimerais la linge du tableau. ainsi je serrais sur d'avoir un affichage cohérent avec le serveur.

A+JYT

[arnogues]

Pour répondre simplement à la question, tu fais une requête ajax en synchrone, ce qui a pour effet de bloquer le navigateur. Reste en asynchrone et utilise une callback pour faire le reste du code

[lebuttazzoni]

D'abord merci pour ces réponses j'ai modifié le code en fonction ce qui donne donc

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
<script>
 
	function deleteMe(row_id,tableid){
	//document.write('row = '+row_id+' de = '+tableid)
	   if(!confirm('Supprime '+row_id+' de '+tableid+' ?')){
	      ev.preventDefault();
	      return false;
	    }else{
 
 
 
			      var dileteobject= null;
			      //document.write(row_id);
 
			      dileteobject = new XMLHttpRequest();
			      dileteobject.open("GET","action.php?row_id="+row_id+"&tableid="+tableid, true);
			      dileteobject.setRequestHeader("Content-type","application/x-www-form-urlencoded");
			      dileteobject.send(null);
			      if (dileteobject.readyState==4 ){alert ("effacé de la table");
                             $('#'+tableid+' #my_row_'+row_id).remove();
 
			      }
 
	    }
	    }
 
</script>

A priori donc on est en asynchrone
l'affacement se fait après que la ligne ai été effacée de la BDD mais dans le navigateur toujours pas

j'ai encore du merder ?

[Neewd]

C'est bien simple, tu as une condition pour effacer ta ligne en jQuery, mais tu ne rentres pas dedans.
Il suffit donc de tester la valeur de retour de .readystate() et voir ce qu'elle retourne, et en fonction tu connaitra l'état du serveur.

Et je ne crois pas que c'est du asynchrone ici, tu peux trouver une documentation ici , j'ai toujours eu l'habitude de faire une fonction readyStateChange pour le callback d'un AJAX en javascript natif.

[sekaijin]

je maintiens vu que tu utilise JQuery fais ton appel AJAX avec JQuery

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
$.ajax({
  type: "GET",
  url: "action.php",
  data: {row_id: row_id, tableid:tableid},
  success: function(data, textStatus, jqXHR) {
    $('#'+jqXHR.data.tableid+' #my_row_'+jqXHR.data.row_id).remove();
  },
  dataType: "json"
});

c'est tout de même plus simple non ?

A+JYT