Discussion :

[silanie]

Bonjour à tous,

Vous vous en doutez, je rencontre quelques soucis avec Javascript.

L'objectif est simple. L'utilisateur d'un BackOffice peut enregistrée différentes données et les classer. Cela se présente sous forme de blocks individuels dans lequel se trouve un select chargé dynamiquement pour faire le classement.
Au préalable, un input text permet de rajouter des valeurs (des catégories) au select dynamique. Ce select est chargé de deux façon : par l'input en gestion immédiate et par php, dans le cas d'une édition de données. Donc les deux peuvent cohabiter et c'est là que le problème est.

Quand on édite, on a un array php qui est généré. On le transmet à JS par un json_encode, afin de permettre à JS de gérer le rajout des catégories. Ma variable category contient les données au format suivant :


Mon besoin est de rajouter des catégories à Object.nl ou Object.fr sachant que les langues ne sont pas fixes (site traduit).

Je ne suis pas douée avec les objets JS et j'ai longuement chercher des solutions sans résultats. Je vous montre le cheminement du code (parce que c'est important )

étape 1 :

Code :

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

var id_category = <?php echo json_encode($tab_category); ?>; (ce qui nous donne le résultat précédent en console)

étape 2 :

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
function updateCategory(id_langue) {
	var cat = $('#id_addcategory_' + id_langue).val();
	//je prépare le select du block concerné
	var opt_category = $('#select_update_category').html();
	opt_category = opt_category.replace(new RegExp('IDADDCATEGORY', 'g'), cat);console.log(id_category.id_langue);
	id_category[id_langue].push(cat);
	var block_cat = $('#block_category').html();
	block_cat = block_cat.replace(new RegExp('LABEL', 'g'), cat);
	$('#list_category_block_' + id_langue).append(block_cat);
        $('#id_addcategory_' + id_langue).val('');
        if($('#list_category_block_' + id_langue + ' .categorie-block').length > 3) {
      		$('.addcategory_field_' + id_langue).hide();
      	}
      	i++;
	$('.comkit_select_'+id_langue).append('<option value="' + cat + '">' + cat + '</option>');
	init_deleteCategory();
}

Sachant que je ne peux pas dissocier cet objet, je dois impérativement l'updater car je le réutilise plus bas avec toutes les catégories qu'il contient (les éventuelles édition chargée par php et les nouvelles ajoutées en js).
Je vous remercie par avance pour votre aide.

[danielhagnoul]

Je ne sais pas si j'ai compris votre besoin, mais voici un exemple montrant comment ajouter et supprimer des catégories et des éléments dans les catégories. Il montre aussi comment lister les clés et les valeurs contenues dans l'objet id_category.

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
function removeElemInArr( array, element ) {
  const index = array.indexOf( element );
 
  if ( index !== -1 ){
    array.splice( index, 1 );
  }
}
 
function updateCategory( id_langue, cat ) {
  id_category[ id_langue ].push( cat );
}
 
let id_category = {
  "fr" : [],
  "nl" : [
    "add nl"
  ]
};
 
updateCategory( "nl", "import" );
updateCategory( "nl", "export" );
updateCategory( "fr", "add fr" );
updateCategory( "fr", "delete" );
 
id_category[ "be" ] = [];
 
updateCategory( "be", "add be" );
updateCategory( "be", "import" );
updateCategory( "be", "export" );
 
// debug, console, touche F12
for ( const key of Object.keys( id_category ) ){
  console.log( key, " : ", id_category[ key ].join( ", " ) );
}
 
console.log( "----" );
 
removeElemInArr( id_category[ "nl" ], "import" );
removeElemInArr( id_category[ "be" ], "add be" );
 
// debug, console, touche F12
for ( const key of Object.keys( id_category ) ){
  console.log( key, " : ", id_category[ key ].join( ", " ) );
}

[silanie]

Le id_categoy[id_langue].push, c'est ce qui existe déjà à l'heure actuelle mais qui ne fonctionne pas.

id_category est un objet à cause de sa conversion par json_encode.
En objet, je pourrais faire id_category.id_langue = cat, mais cela ne fonctionne pas pour deux raison.
La première, c'est que .push() ne semble pas être une méthode applicable à l'objet, j'ai un message d'erreur en concole qui me dit que push n'est pas une fonction.
La seconde, id_langue étant dynamique, quand je fais cela, si id_langue vaut "nl", il me charge l'objet mais pas dans l'array "nl' qu'il contient. Il me créé un nouvel array qui s'appelle id_langue. Je me retrouve avec 3 array dans mon objet, l'array "fr", l'array "nl" et l'array "id_langue".

Mon besoin, c'est de pouvoir charger mes données en js sous ce format là :

Code :

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

1
2
3
4
5
6
7
8
9
id_category (objet)
        "fr" =>
                0 => "categorie 1",
                1 => "categorie 2",
                etc...,
        "nl" =>
                0 => "categorie 3",
                1 => "categorie 4",
                etc...,

Un format obtenu par le json_encode qu'il me faut pouvoir updater en conservant ce format. Je sais pas si je suis plus clair ainsi

[silanie]

Bon du coup, j'ai fini par me résoudre à faire un ensemble de fonction et restructurer le traitement js.

Merci pour ton aide