Discussion :

[nico78200]

Bonjour à tous,

Je souhaite faire quelque chose de tout simple, à savoir, construire un array avec des keys variables mais je ne trouve pas syntaxe correct... Après avoir parcouru en long et en large les résultat de google je ne trouve réponse à ma question... Voici un exemple pour illustrer tout ça:

Code :

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

1
2
3
4
5
6
7
8
9
10
 
		foo: function() {
			var a = [];
			$('.foo:visible').each(function() {
				var cId = $(this).attr('id');
				var content = $(this).html());
                                a[cId] = content;
			});
			return a;
		}

Cette syntaxe n'est pas correct, j'ai aussi essayé avec la fonction .push({key:value}), mais ça ne fonctionne pas non plu.

En PHP un simple

Code php :

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

$array[$key] = $value;

aurais fonctionné, je recherche un équivalant en javascript.

Merci de votre aide.

Nico

[SpaceFrog]

le principe de l'array littéral est bon, je pense que tu as plutot un souci d'algo ...

tu fermes le each avant d'attribuer l'indexe ...

[scourjean]

Et comme ceci ça ne serait pas mieux ?

Code :

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

1
2
var a = new Array();
a[cid] = content;

[SpaceFrog]

je pense que ça veint plsu de ça:

Code :

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

1
2
3
4
5
6
7
8
9
foo: function() {
			var a = [];
			$('.foo:visible').each(function() {
				var cId = $(this).attr('id');
				var content = $(this).html();
                                a[cId] = content;)
			});
			return a;
		}

[NoSmoking]

je pense que ça veint plsu de ça:

là il y à du gros mélange doigtal dans l'air SpaceFrog!!!

Ceci explique peut être la réponse, je la sentirais plus

Code :

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

1
2
3
4
5
6
7
8
9
foo : function() {
  var a = [];
  $('.foo:visible').each(function() {
    var cId = $(this).attr('id');
    var content = $(this).html();
    a[cId] = content;
  });
  return a;
};

[nico78200]

Bonjour et merci à tous pour l'aide,

@NoSmoking: Je ne vois pas la nuance entre ta syntaxe et la mienne?

@scourjean: D'aprés la documentation de jQuery je peut aussi bien déclarer un array avec 'new Array()' que '[]', bien que la première syntaxe me parait plus logique et correct, les deux fonctionnes à l'identique dixit la documentation officielle.

Sinon je bloque toujours sur ce problème, que je pourrai contourner en créant 2 array distinct avec pour un les keys et pour l'autres les valeurs et ensuite les joindre, mais dans un soucis d'optimisation je suis certain qu'il y a beaucoup plus simple non?

Nico

[NoSmoking]

@NoSmoking: Je ne vois pas la nuance entre ta syntaxe et la mienne?

ce n'est pas une nuance mais une parenthèse fermante de trop sur la ligne 5, et comme te la mentionnée SpaceFrog cela entraîne la fermeture de la fonction avant l'affectation, du coup il y en a une de trop et cela plante.

Concernant les array il est bon de savoir qu'il est préférable d'adopter la syntaxe [] et ce contenu que...

Code :

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

1
2
3
4
var Tab_1 = new Array(3); // creation d'un tableau de 3 elements vide
var Tab_2 = [3];          // creation d'un tableau d'un element valant 3
alert( Tab_1);
alert( Tab_2);

cela peut être gênant, donc le plus sage me semble être la deuxième syntaxe.

[nico78200]

Ha ok j'ai saisi la nuance pour la création d'array, sinon concernant la parenthèse c'est une faute de frappe effectivement (un résidu de test avec push() ). Dans mon code source elle n'y est pas.

Nico

[nico78200]

Voici le contenu exact de ma méthode, qui sert à sérialiser tout les contenus des '[contenteditable=true]' pour les enregistrer dans ma db.

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
 
		serializeEditableContent: function() {
			var editableContent = [];
			$('[contenteditable=true]:visible').each(function() {
				var cId = $(this).attr('id');
				var content = $(this).html();
				editableContent[cId] = content;
				console.log('*************************');
				console.log(editableContent);
				console.log('*************************');			
			});
			return editableContent;
		}

Et voici le résultat dans la console:

Code :

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

1
2
3
4
 
*************************
[]
*************************

Je précise tout de même que si je push() les données à la suite dans l'array, j'ai bien les valeurs que je souhaite obtenir.

Merci de votre aide.

Nico

[NoSmoking]

attention quand même avec les tableaux associatifs l'accès aux éléments est différent.
essaies avec

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
serializeEditableContent: function () {
  var editableContent = [];
  $('[contenteditable=true]:visible').each(function () {
    var cId = $(this).attr('id');
    var content = $(this).html();
    editableContent[cId] = content;
  });
  // lecture est affichage du resultat
  var sTmp = "";
  for (var i in editableContent) {
    sTmp += i + '->' + editableContent[i] + '\n';
  }
  alert(sTmp);
  return (editableContent);
}

[nico78200]

Merci beaucoup pour l'explication NoSmoking, je test ça dès que je le peut.

Nicolas

[nico78200]

Oui en effet, ca fonctionne parfaitement, merci beaucoup. Il me reste une dernière question (oui je sais je deviens lourd là^^), pourquoi lorsque j'envoi l'array via ajax vers un script la variable POST est totalement vide?

Comment le rendre correctement récupérable en PHP?

Merci encore pour votre précieuse aide.

Nico

[nico78200]

Une autres syntaxe plus cohérente pour ma problématique d'array:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
		serializeEditableContent: function() {
			var editableContent = [];
			$('[contenteditable=true]:visible').each(function() {
				editableContent.push({
					'id' : $(this).attr('id'),
					'content': $(this).html()
				});
			});
			return editableContent;
		}

[nico78200]

Coté serveur (PHP 5.2.6-1+lenny9 with Suhosin-Patch 0.9.6.2) un var_dump de $_POST['editableContent'] envoyé via la méthode ajax() de jQuery en POST me retourne " string(15) "[object Object]" ".

Il est tard je testerai bien en GET, au moins il sera décortiqué je pense.

Merci d'avance à une âme charitable (ou un geek insomniaque ) de m'éclairer car là je sèche complètement...

Nico

[NoSmoking]

pourquoi ne pas utiliser la méthode traditionnelle d'envoi, tu récupères dans $_GET ou $POST un tableau associatif...

Code php :

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

1
2
3
foreach($_POST as $id => $content){
  echo '-'.$id.' : '.$content.'<br>';
}

et qu'est ce que tu lis dans "[object Object]"

mais là je vais écrire des âneries, il vaut sûrement mieux voir coté PHP. J'en ai peut être écrit une d'ailleurs!

[nico78200]

pourquoi ne pas utiliser la méthode traditionnelle d'envoi, tu récupères dans $_GET ou $POST un tableau associatif...

Parce que je travail sur une rich UI et non sur une page web.

Code php :

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

1
2
3
foreach($_POST as $id => $content){
  echo '-'.$id.' : '.$content.'<br>';
}

et qu'est ce que tu lis dans "[object Object]"

Le résultat de dump_var() m'indique qu'il s'agit d'un string ([object Object]), mon problème se situe donc au niveau de javascript. Je me repenche dessus demain en fin d’après midi, je pense que contrairement à ce que dit la documentation jQuery c'est la fonction ajax() qui ne sait pas envoyer d'array ou seulement un type spécifique d'objet...

Bonne soirée.

Nico

[NoSmoking]

tu peux également essayer le JSON...

[nico78200]

Oui JSON sera traité comme un string mais coté serveur visiblement ma version de PHP embarque des méthode natives pour traiter le JSON, je vais tester tout ça. Mais ça reste une solution de fortune à mon sens...

En tout cas un grand merci pour ton aide NoSmocking.

[nico78200]

Bon ça reste un beau bricolage sans nom, mais aprés avoir parcouru divers topics et documentation, il semble effectivement impossible d'envoyer un array (multidimensionnel) de manière asynchrone. La solution est de passer par JSON par exemple (jQuery n'embarque pas en natif de fonction pour travailler, convertir des objets JSON...).

Pas envie d'intégrer un plugin pour transformer mon application en usine à gaz, alors j'ai fais une methode pour mettre à plat dans le query_string envoyé via ajax() par POST:

Code :

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

1
2
3
4
5
6
7
8
9
10
 
		array2string: function(arr, name) {
			var sTmp = "";
			for (var i in arr) {
				// Echaper les specials chars pour ne pas fausser le query_string
				var content = escape(arr[i]);
				sTmp += '&'+i + '=' + content;
			}
			return sTmp;
		},

Inconvénient, il faut connaitre le nombre d’élément de son array coté serveur, et donc oublier tout les traitements en boucle....

Bref je ne suis pas vraiment satisfait de cette solution donc je vais tester des pistes concernant json ou xml. Pourtant ca me semblais un jeu d'enfant, j'aurais jamais imaginer perdre autant de temps pour un traitement aussi simple....

[NoSmoking]

effectivement impossible d'envoyer un array (multidimensionnel) de manière asynchrone

quoiqu'il arrive on envoie une string qui elle est décodée coté serveur, que cela soit un tableau ou du json le transfert se fera de la même façon, une STRING.

Dans ton cas autant la mettre en place directement dans la fonction de départ

Code :

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

1
2
3
4
5
6
7
8
9
serializeEditableContent: function () {
  var i = 0,tab = [], cId, content;
  $('[contenteditable=true]:visible').each(function () {
    cId = $(this).attr('id');
    content = $(this).html();
    tab[i++] = encodeURIComponent(cId) +'=' +encodeURIComponent(content);
  });
  return (tab.join('&');
}

ou un truc approchant.