Discussion :

[Marmotton76]

Bonsoir tout le monde,

Dans ma page, voici la syntaxe HTML de base de ma liste :

Code html :

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

1
2
3
4
5
6
 
<ul id="ul_categories">
  <li id="liste_categ1"><a href='categ.php?action=visu_categorie&amp;categ=1'>Titre catég 1</a></li>
  <li id="liste_categ2"><a href='categ.php?action=visu_categorie&amp;categ=2'>Titre catég 2</a></li>
  <li id="liste_categ3"><a href='categ.php?action=visu_categorie&amp;categ=3'>Titre catég 3</a></li>
</ul>

Je vous épargne tout les codes PHP, MySql et AJAX qui me permettent 1) de parser cette liste UL 2) de remplir et traiter un formulaire "Ajout nouvelle catégorie" (tout simplement parce que toutes ces jolies lignes de code fonctionnent à merveille et ne sont pas l'objet de ma présente demande !!!)

MAIS...

J'utilise une fonction JS qui ajoute "à la volée" une nouvelle balise <li>contenu</li> à l'intérieur de ma balise existante <ul id="ul_categories">, dans le cas où j'ai un retour AJAX positif sur un formulaire de création d'une NOUVELLE CATEGORIE.

Ca donne :

Code :

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

ajout_LI('ul_categories',4,'Titre catég 4')

Code :

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

1
2
3
4
5
6
7
8
9
 
function ajout_LI(div_ul,id_cat,titre_cat) {
    var oUl = document.getElementById(div_ul);
    var oLi = document.createElement("li");
    var oText = document.createTextNode('<a href="categ.php?action=visu_categorie&amp;categ='+id_cat+'">'+titre_cat+'</a>');
    oLi.appendChild(oText);
    oUl.appendChild(oLi);
    return oLi;
}

Donc en principe, je devrais avoir un nouveau nœud dans ma <ul> qui m'affiche en HTML :

Code html :

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

1
2
 
<a href='categ.php?action=visu_categorie&amp;categ=4'>Titre catég 4</a>

SAUF QUE, en réalité, mon nouveau lien comporte des caractères spéciaux :

Code html :

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

1
2
 
<li>&lt;a href="categ.php?action=visu_categorie&amp;categ=4&amp;categ=4"&gt;Titre catég 4&lt;/a&gt;</li>

Le problème, c'est que ces caractères spéciaux me renvoient un lien inopérant dans ma page HTML : au lieu d'avoir un bon gros lien normal (c'est-à-ditr un titre souligné avec, derrière, un lien effectif), s'affiche dans ma liste une chaîne de caractères brute et non cliquable du genre :

Code html :

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

<a href="categ.php?action=visu_categorie&amp;categ=4">Titre catég 4</a>

Je suppute donc que j'ai un problème d'encodage (ou de décodage) de ma chaîne de caractères en JavaScript, mais là, je bloque...

Merci pour votre aide. @+

[Eric2a]

Salut,

C'est la méthode document.createTextNode qui encode les caractères spéciaux. Dans ton cas, elle ne doit pas être utilisée pour créer l'ancre du lien.

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
function ajout_LI(div_ul,id_cat,titre_cat){
	var ul,li,a,txt;
 
	ul=document.getElementById(div_ul);
 
	li=document.createElement('li');
	li.id='liste_categ'+id_cat;
 
	a =document.createElement('a');
	a.setAttribute('href','categ.php?action=visu_categorie&categ='+id_cat);
 
	txt=document.createTextNode(titre_cat);
	a.appendChild(txt);
	li.appendChild(a);
	ul.appendChild(li);
 
	return li;
}

[NoSmoking]

Bonsoir,

Code :

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

var oText = document.createTextNode...

crée un noeud texte, donc remplace les caractères spéciaux tel que < et > pour que le texte soit affichable.

Il te faut utiliser la propriété innerHTML dans ce cas

Code :

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

oLi = document.innerHTML = '<a href="categ.php?action=visu_categorie&amp;categ='+id_cat+'">'+titre_cat+'</a>';

C'est néanmoins louable que de vouloir utiliser les méthodes DOM.

[SpaceFrog]

Accessoirement tu peux jeter un oeil sur ce tuto
http://j-willette.developpez.com/tut...-site-en-utf8/

[Marmotton76]

Merci infiniment à vous trois, ça fonctionne nickel maintenant !

Bon dimanche @+