Ecrire le contenu d'un textarea modifier avec du javascript

Mammouth du PHP | 19672 Messages

22 nov. 2006, 21:35

... ensuite on s'occuera de changer le input par un div...
Et où feras-tu ta saisie si tu n'as plus de zone de formulaire prévue pour ça ???
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 106 Messages

23 nov. 2006, 12:27

ok on ne sait tjs pas compris. J'ai un formulaire comme sur l'image du dessin de gauche. Sur l'image du vas il est trevisualiser. Ensuite il est enregistrer non transformer dans une page (txt ou php) puis cette page est inclu dans une autre apeller index.php. Normallement on doit le faire en php pour transformer, mais la je doit le faire en javascript. donc le code du div est a peu pret cela :
<div id="apercu"><? include("pageouestenregistrerlebbcodenontransformer.php"); ?></div>
Bon revenon a nos moutons principale. Le code que j'ai fait est-il juste??
Faut-il initialiser la varible avant??

Mammouth du PHP | 19672 Messages

23 nov. 2006, 13:51

Bon, désolé, mais moi, j'arrête les frais. Je t'ai donné tous les éléments indispensables, tu ne veux visiblement pas les utiliser, alors débrouille-toi, moi, je sature.
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 106 Messages

23 nov. 2006, 13:55

S'il te plait j'ai vraiment besoin de toi :cry: :cry:

Ok je vais essayer de faire un effort. Dis moi mon erreur je vais la reprendre.

Mais s'il te plait n'abandonne pas je t'en prie s'il te plait :cry:

Mammouth du PHP | 19672 Messages

23 nov. 2006, 14:01

Non, ce n'est pas de moi que tu as besoin, c'est d'une solution toute faite, tu ne réfléchis pas et les indications que je te donne te passent à des kilomètres par dessus la tête. Désolé, mais si c'est trop compliqué pour toi, fais autre chose. Je te l'ai déjà dit, je ne te ferai pas une formation complète en programmation dont tu as de toute évidence un grand besoin. La programmation, ça ne s'improvise pas, c'est de la logique et de la rigueur. Cultive l'un et l'autre et commence avec des problèmes plus simples.
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 106 Messages

23 nov. 2006, 14:06

J'ai vraiment besoin de ce script. Je vais me resonner et faire des effort. Je vais essayer de resonne rlogiquement alors si tu veut bien je me reprend en main. Dehors le laisser aller je suis concentrer c'est partie.
function previsualiser()
{
    /* Récupération des données saisies */
// balise Gras
        msg=deblaie(/([/gras])/g,msg)
       msg=remplace_tag(/[gras](.+)[/gras]/g,'<b>$1</b>',msg)
        msg=remblaie(msg)
// balise Souligne
      msg=deblaie(/([/souligne])/g,msg)
     msg=remplace_tag(/[souligne](.+)[/souligne]/g,'<u>$1</u>',msg)
      msg=remblaie(msg
   var msg = document.forms['saisiemsg'].elements['msg'].value;
    /* Affichage du message saisi dans un bloc de la page */
    document.getElementById('apercu').innerHTML = msg;
}
    
Commencont simplement et logiquement.

Grace a ton aide j'ai fait cela. Ne t'enerve pas si j'ai fait une erreur je suis attentif et j'ecoute.

Alots ai-je fait une erreur, et ou??

Mammouth du PHP | 19672 Messages

23 nov. 2006, 14:20

Bon, ok, alors je te laisse une petite chance, mais il n'y en aura pas d'autre.

Premièrement, pour te discipliner et t'aider toi-même à comprendre ce que tu fais, ajoute systématiquement des commentaires avant chaque instruction de code pour décrire ce que ça va faire : tu vas te retrouver avec des scripts qui auront plus de la moitié en commentaire, mais c'est une habitude indispensable en apprentissage.

Dans la fonction que tu montres, il y a effectivement une erreur. Tu effectues des traitement sur la variable "msg", mais tu n'initialises cette variable qu'après. Ça ne peut donc que générer une erreur. Une question du reste me vient à l'esprit : sais-tu ce que signifie "initialiser une variable" ?

Ta fonction remise en forme :
/**
 * Fonction qui va transformer les bbCodes en balises HTML pour affichage
 */
function previsualiser()
{
    /*  D'abord : Récupération des données saisies */
    var msg = document.forms['saisiemsg'].elements['msg'].value;
    
    /*
     * Ensuite : instruction de traitement, on fait appel aux 
     * autres fonctions : deblaie(), remplace() et remblaie()
     */
    /* balise Gras */
    msg = deblaie(/([/gras])/g,msg);
    msg = remplace_tag(/[gras](.+)[/gras]/g,'<b>$1</b>',msg);
    msg = remblaie(msg);
    /* balise Souligne */
    msg = deblaie(/([/souligne])/g,msg);
    msg = remplace_tag(/[souligne](.+)[/souligne]/g,'<u>$1</u>',msg);
    msg = remblaie(msg);
    
    /* Enfin : Affichage du message transformé dans un bloc de la page */
    document.getElementById('apercu').innerHTML = msg;
}
Et lis les commentaires, ils expliquent ce qui se passe dans le code.
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 106 Messages

23 nov. 2006, 14:27

initialiser une varible c'est je sais pas comment explqiuer cela; c'est dire a quoi elle servira defenir son domaine d'action, initialiser, créer.

Voila pour le code c'est bien ce que je pensait; ce que je t'avais dit. On initialise avant et c'est logique bon maintenant qu'on a le code qui tranforme ; passon au probleme des retour a la ligne. J'ai fait cela :


// retour chariot
msg=deblaie(/(\n)/g,msg)
msg=remplace_tag(/\n(.+)\n/g,'<br>',msg)
msg=remblaie(msg)

Mais je ne sait pas si en javascript les retour a la ligne sont \n.

Mammouth du PHP | 19672 Messages

23 nov. 2006, 14:34

Initialiser une variable, c'est la créer et lui assigner une valeur.

Pour la suite : as-tu essayé ?
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 106 Messages

23 nov. 2006, 14:38

oulala je me melange les pinceau. Oui j'ai essayer mais je me suis apercu qu'il y avait une erreur. J'ai rien dit.

Bon 3eme probleme deja 2 de resolu.

Pour enlever les <> en clair pour empeche le html. On en a deja parler et j'ai fait ce que vous m'avez dit. Mais le probleme que j'ai eu c'est que ca empeche aussi la previsualisation. Les balise bbcode sont transformer en balise html et la elle sont inactive a cause de la partie du code qui transfrome les <>.

Mammouth du PHP | 19672 Messages

23 nov. 2006, 14:44

Pose toi la question autrement : si du code html est saisi dans le formulaire, il ne doit pas être interprété. Par contre les balises bbCodes transformées en balises doivent elles être interprétées et donc laissées en l'état. Donc, il y a un ordre logique pour exécuter les instructions. Penses-y un petit moment.
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 106 Messages

23 nov. 2006, 17:33

Donc si j'ai bien compris ce que tu essai de me faire comprendre, c'est qu'il faut mettre la transformation de<>a l afin du js.

Mammouth du PHP | 19672 Messages

23 nov. 2006, 17:41

Tu y es presque. Si l'internaute saisit du html dans le formulaire, ce HTML doit être affiché tel quel, il faut donc transformer les < et > en < et > . ensuite seulement, tu fais les transformations des bbCodes en balises html normales : à l'affichage, les balises HTML normales seront interprétées et donc invisibles alors que les entités seront affichées.

Si tu fais la transformation des < et > à la fin, toutes les balises qui remplacent les bbCodes vont subir le même sort et le texte sera affiché sans aucune mise en forme HTML.
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe:

Eléphant du PHP | 106 Messages

23 nov. 2006, 17:57

Merci chef ca marche.

Derniere etape le div.

Voila j'ai ce code : cela ne te derangerai pas qu'on analise ensemble :
var timer=0;
var ptag=String.fromCharCode(5,6,7);
function  previsualisation() {
        t=document.formulaire.textarea.value
        t=code_to_html(t)
        if (document.getElementById) document.getElementById("prev").innerHTML=t
        if (document.formulaire.auto.checked) timer=setTimeout(previsualisation,1)
}
function automatique() {
        if (document.formulaire.auto.checked) previsualisation()
}
function code_to_html(t) {
        t=nl2khol(t)
// <	
		t=remplace_tag(/</g,'<',t)
        t=remblaie(t)
        t=unkhol(t)
        t=nl2br(t)
// >
		 t=remplace_tag(/>/g,'>',t)
        t=remblaie(t)
        t=unkhol(t)
        t=nl2br(t)
// balise Gras
        t=deblaie(/(\[\/gras\])/g,t)
        t=remplace_tag(/\[gras\](.+)\[\/gras\]/g,'<b>$1</b>',t)
        t=remblaie(t)
// balise Souligne
		t=deblaie(/(\[\/souligne\])/g,t)
		t=remplace_tag(/\[souligne\](.+)\[\/souligne\]/g,'<u>$1</u>',t)
		t=remblaie(t)

		//       
		return t
		//
//SMILIES FIN
//DEBUT INFO - ATTENTION - ...

//FIN INFO - ATTENTION - ...
}
function deblaie(reg,t) {
        textarea=new String(t);
        return textarea.replace(reg,'$1\n');
}
function remblaie(t) {
        textarea=new String(t);
        return textarea.replace(/\n/g,'');
}
function remplace_tag(reg,rep,t) {
        textarea=new String(t);
        return textarea.replace(reg,rep);
}
function nl2br(t) {
        textarea=new String(t);
        return textarea.replace(/\n/g,'<br/>');
}
function nl2khol(t) {
        textarea=new String(t);
        return textarea.replace(/\n/g,ptag);
}
function unkhol(t) {
        textarea=new String(t);
        return textarea.replace(new RegExp(ptag,'g'),'\n');
}
Bon petit a petit :
var timer=0;
var ptag=String.fromCharCode(5,6,7);
function  previsualisation() {
        t=document.formulaire.textarea.value
        t=code_to_html(t)
        if (document.getElementById) document.getElementById("prev").innerHTML=t
        if (document.formulaire.auto.checked) timer=setTimeout(previsualisation,1)
}
function automatique() {
        if (document.formulaire.auto.checked) previsualisation()
}
1ere et 2eme ligne je ne comprend pas trop.
Ensuite 3eme et 4eme ligne on a la fonction de previsualisation. On recupere le contenu de la value du textarea du formulaire.
5eme ligne je ne sait pas.
puis ensuite on a je pense l'affichade dans le div avec comme id prev
et enfin une derniere fonction qui correspond a l'ction oui ou non de la case "previsualisation autommatique" si elle est coché ou pas.

Que faut il change pour que la previsualisation soit automatique quoi qu'on fasse?
  return t
        //
//SMILIES FIN
//DEBUT INFO - ATTENTION - ...

//FIN INFO - ATTENTION - ...
}
function deblaie(reg,t) {
        textarea=new String(t);
        return textarea.replace(reg,'$1\n');
}
function remblaie(t) {
        textarea=new String(t);
        return textarea.replace(/n/g,'');
}
function remplace_tag(reg,rep,t) {
        textarea=new String(t);
        return textarea.replace(reg,rep);
}
function nl2br(t) {
        textarea=new String(t);
        return textarea.replace(/n/g,'<br/>');
}
function nl2khol(t) {
        textarea=new String(t);
        return textarea.replace(/n/g,ptag);
}
function unkhol(t) {
        textarea=new String(t);
        return textarea.replace(new RegExp(ptag,'g'),'\n');
}
Ensuite ici on a les derniere choses a remplacer.

Donc comme je viens de le dire on a pluseirs chose a faire :
1-mettre la previsualisation en automatique quoi qu'il se passe
2-mettre que l'on recupere le contenu d'un un div avec pour id=contenu.
3-Tester!

Mammouth du PHP | 19672 Messages

23 nov. 2006, 18:13

var timer=0;
var ptag=String.fromCharCode(5,6,7);
function  previsualisation() {
        t=document.formulaire.textarea.value
        t=code_to_html(t)
        if (document.getElementById) document.getElementById("prev").innerHTML=t
        if (document.formulaire.auto.checked) timer=setTimeout(previsualisation,1)
}
function automatique() {
        if (document.formulaire.auto.checked) previsualisation()
}
1ere et 2eme ligne je ne comprend pas trop.
Ensuite 3eme et 4eme ligne on a la fonction de previsualisation. On recupere le contenu de la value du textarea du formulaire.
5eme ligne je ne sait pas.
puis ensuite on a je pense l'affichade dans le div avec comme id prev
et enfin une derniere fonction qui correspond a l'ction oui ou non de la case "previsualisation autommatique" si elle est coché ou pas.

Que faut il change pour que la pré-visualisation soit automatique quoi qu'on fasse?
  1. 1ere et 2eme ligne : ce sont des initialisations de variable. Les deux variables sont créées et on leur assigne une valeur. Ces variables sont créées en principe pour une utilisation ultérieure.
  2. La 5eme ligne aussi : on modifie la valeur de t en lui assignant quoi ? la valeur retournée par la fonction code_to_html()

    Si tu as plusieurs lignes qui commencent par "t = quelque chose", ça veut dire qu'à chacune de ces lignes, on modifie la valeur du contenu de t. Donc demande-toi ce que fait cette fonction code_to_html() et tu aura ta réponse.
  3. Enfin, la pré-visualisation automatique : que fait cette fonction automatique() selon toi ?
Codez en pensant que celui qui maintiendra votre code est un psychopathe qui connait votre adresse :axe: