Insertion de balises dans une zone de texte

Résolu
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   -  
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour,
Je viens de suivre le tutoriel de Thunderseb "Insertion de balises dans une zone de texte " publié sur le site du zéro (disponible ici: http://www.siteduzero.com/tutoriel-3-34703-insertion-de-balises-dans-une-zone-de-texte.html

Seulement, je ne gère pas bien le javascript, et mon code obtenu ne fonctionne pas, pourriez-vous me dire pourquoi?

Le résultat: http://crocoscore.free.fr/
Les fichiers sources: http://crocoscore.free.fr/BBCODE.7z

Merci de votre aide, à bientôt !
A voir également:

23 réponses

avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
<textarea onkeyup="preview(this, 'previewDiv');" ...
Et la fonction :
function preview(textareaId, previewDiv) {
	var field = textareaId.value;
	if (document.getElementById('previsualisation').checked && field) {
		
		var smiliesName = new Array(':magicien:', ':colere:', ':diable:', ':ange:', ':ninja:', '>_<', ':pirate:', ':zorro:', ':honte:', ':soleil:', ':\'\\(', ':waw:', ':\\)', ':D', ';\\)', ':p', ':lol:', ':euh:', ':\\(', ':o', ':colere2:', 'o_O', '\\^\\^', ':\\-°');
		var smiliesUrl  = new Array('magicien.png', 'angry.gif', 'diable.png', 'ange.png', 'ninja.png', 'pinch.png', 'pirate.png', 'zorro.png', 'rouge.png', 'soleil.png', 'pleure.png', 'waw.png', 'smile.png', 'heureux.png', 'clin.png', 'langue.png', 'rire.gif', 'unsure.gif', 'triste.png', 'huh.png', 'mechant.png', 'blink.gif', 'hihi.png', 'siffle.png');
		var smiliesPath = "http://www.siteduzero.com/Templates/images/smilies/";
	
		field = field.replace(/&/g, '&amp;');
		field = field.replace(/</g, '<').replace(/>/g, '>');
		field = field.replace(/\n/g, '<br />').replace(/\t/g, '&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;');
		
		field = field.replace(/([\s\S]*?)<\/gras>/g, '<strong>$1</strong>');
		field = field.replace(/<italique>([\s\S]*?)<\/italique>/g, '<em>$1</em>');
		field = field.replace(/<lien>([\s\S]*?)<\/lien>/g, '<a href="$1">$1</a>');
		field = field.replace(/<lien url="([\s\S]*?)">([\s\S]*?)<\/lien>/g, '<a href="$1" title="$2">$2</a>');
		field = field.replace(/<image>([\s\S]*?)<\/image>/g, '<img src="$1" alt="Image" />');
		field = field.replace(/<citation nom=\"(.*?)\">([\s\S]*?)<\/citation>/g, '<br /><span class="citation">Citation : $1</span><div class="citation2">$2</div>');
		field = field.replace(/<citation lien=\"(.*?)\">([\s\S]*?)<\/citation>/g, '<br /><span class="citation"><a href="$1">Citation</a></span><div class="citation2">$2</div>');
		field = field.replace(/<citation nom=\"(.*?)\" lien=\"(.*?)\">([\s\S]*?)<\/citation>/g, '<br /><span class="citation"><a href="$2">Citation : $1</a></span><div class="citation2">$3</div>');
		field = field.replace(/<citation lien=\"(.*?)\" nom=\"(.*?)\">([\s\S]*?)<\/citation>/g, '<br /><span class="citation"><a href="$1">Citation : $2</a></span><div class="citation2">$3</div>');
		field = field.replace(/<citation>([\s\S]*?)<\/citation>/g, '<br /><span class="citation">Citation</span><div class="citation2">$1</div>');
		field = field.replace(/<taille valeur=\"(.*?)\">([\s\S]*?)<\/taille>/g, '<span class="$1">$2</span>');
		
		for (var i=0, c=smiliesName.length; i<c; i++) {
			field = field.replace(new RegExp(" " + smiliesName[i] + " ", "g"), "&nbsp;<img src=\"" + smiliesPath + smiliesUrl[i] + "\" alt=\"" + smiliesUrl[i] + "\" />&nbsp;");
		}
		
		document.getElementById(previewDiv).innerHTML = field;
	}
		var content = encodeURIComponent(document.getElementById(<gras>textareaId).value);
En mettant "this", tu passes l'objet de la textarea.
Donc pour récupérer la valeur, c'est ok, mais après tu ne peux pas faire un getElementById avec comme paramètre un objet.
Donc remplace "document.getElementById(textareaId).value" par "textareaId.value"
3
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Tu as mis le onclick sur le bouton "G" mais pas sur les autres ...
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Oui, je le sais mais la prévisualisation ne fonctionne pas quand même...
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
SVP, c'est très urgent !
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
excuses moi, je ne comprends pas bien, pourrai tu faire le code pour moi stp ?
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Cela ne fonctionne toujours pas. J'ai réuploadé les fichers source après la modification que tu ma dit de faire, mais je ne suis vraiment pas sur de moi...
Fichiers sources: http://crocoscore.free.fr/BBCODE.7z
Résultat: http://crocoscore.free.fr/

Merci de ton aide précieuse
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Svp !
0
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Je te l'ai +/- corrigé.
Par contre, tu mélange l'aperçu final avec l'aperçu en direct.
Tu dois avoir la fonction "preview" qui parse en Javascript et une fonction "visualisation" qui appelle le fichier PHP avec AJAX.
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Je suis complètement perdu...
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
SVP
0
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Que veux-tu que j'y fasse ?
Tu veux que j'envoie des F-16 en mission de repérage ?
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Non je sais que c'est pas bien de demandé ça mais là je sais vraiment pas comment faire, pourrais-tu me faire le script stp ? Je t'en serais vraiment reconnaissent... Merci d'avance
0
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
J'y regarderai plus tard
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Merci beaucoup ! C'est le dernier code qu'il me manque pour finir complétement mon site... à bientôt
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Pour pouvoir avancer mon site, j'ai déplacé le dossier dans /BBCODE les nouvelles adresse sont:

Fichiers sources: http://crocoscore.free.fr/BBCODE/BBCODE.7z
Résultat: http://crocoscore.free.fr/BBCODE/
0
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
http://nayi.free.fr/dev/tutoriaux/zform/base.html
C'est au tout début du tutoriel :)
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Euh, je ne comprends pas ce que tu veux dire.
0
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Un lien vers le résultat du tutoriel est donné au début de celui-ci.
Donc tu as le script tout fait, il suffit de regarder dans le code source.
0
crocoscore Messages postés 165 Date d'inscription   Statut Membre Dernière intervention   5
 
Je crois en faite que c'est un problème avec la page PHP que je ne peut pas regarder sur la page du résultat...
0
avion-f16 Messages postés 19252 Date d'inscription   Statut Contributeur Dernière intervention   4 507
 
Pour le PHP il suffit de faire un copier/coller alors si tu te trompe à ça !!
Tu passes bien par un serveur ?
Si tu testes en local, utilises-tu quelque-chose comme Wamp, EasyPHP, Xampp, ... ?
0