couleur dans un formulaire

**cyril3d** · 09/04/2008, 14h46

bonjour tout le monde!

bon alors c'est parti (c'est long mais pas compliqué, la synthaxe est extremement facile)

j'ai un formulaire qui envoie un message. or je veux mettre des boutons qui permettent de mettre en gras (donc quand on clique sur le bouton, un code apparait dans mon form qui permet de mettre en gras)

pour ce faire, j'ai copié collé la fonction (n'y connaissant rien en js, je peux seulement vous afficher la fonction)

la fonction se trouve sur la page du formulaire:

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
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
 
<p align="center">Envoyer un mail</p></h1> 
<form name="news" method="post" action="newsletter.php"> 
<script language="Javascript"> 
var isMozilla = (navigator.userAgent.toLowerCase().indexOf('gecko')!=-1) ? true : false; 
var regexp = new RegExp("[\r]","gi"); 
 
function storeCaret(selec) 
{ 
if (isMozilla) 
{ 
// Si on est sur Mozilla 
 
oField = document.forms['news'].elements['message']; 
 
objectValue = oField.value; 
 
deb = oField.selectionStart; 
fin = oField.selectionEnd; 
 
objectValueDeb = objectValue.substring( 0 , oField.selectionStart ); 
objectValueFin = objectValue.substring( oField.selectionEnd , oField.textLength ); 
objectSelected = objectValue.substring( oField.selectionStart ,oField.selectionEnd ); 
 
// alert("Debut:'"+objectValueDeb+"' ("+deb+")\nFin:'"+objectValueFin+"' ("+fin+")\n\nSelectionné:'"+objectSelected+"'("+(fin-deb)+")"); 
 
oField.value = objectValueDeb + "[" + selec + "]" + objectSelected + "[/" + selec + "]" + objectValueFin; 
oField.selectionStart = strlen(objectValueDeb); 
oField.selectionEnd = strlen(objectValueDeb + "[" + selec + "]" + objectSelected + "[/" + selec + "]"); 
oField.focus(); 
oField.setSelectionRange( 
objectValueDeb.length + selec.length + 2, 
objectValueDeb.length + selec.length + 2); 
} 
else 
{ 
// Si on est sur IE 
 
oField = document.forms['news'].elements['message']; 
var str = document.selection.createRange().text; 
 
if (str.length>0) 
{ 
// Si on a selectionné du texte 
var sel = document.selection.createRange(); 
sel.text = "[" + selec + "]" + str + "[/" + selec + "]"; 
sel.collapse(); 
sel.select(); 
} 
else 
{ 
oField.focus(oField.caretPos); 
// alert(oField.caretPos+"\n"+oField.value.length+"\n") 
oField.focus(oField.value.length); 
oField.caretPos = document.selection.createRange().duplicate(); 
 
var bidon = "%~%"; 
var orig = oField.value; 
oField.caretPos.text = bidon; 
var i = oField.value.search(bidon); 
oField.value = orig.substr(0,i) + "" + orig.substr(i, oField.value.length); 
var r = 0; 
for(n = 0; n < i; n++) 
{if(regexp.test(oField.value.substr(n,2)) == true){r++;}}; 
pos = i + 2 + selec.length - r; 
//placer(document.forms['news'].elements['message'], pos); 
var r = oField.createTextRange(); 
r.moveStart('character', pos); 
r.collapse(); 
r.select(); 
 
} 
} 
} 
 
</script>

ensuite j'ai créé un bouton pour mettre en gras, en souligné, en couleur,et en italique:

Code :

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

1
2
3
4
5
<input type="button" value="b" style="width:50px;font-weight:bold" onclick="storeCaret('b')"> 
<input type="button" value="i" style="width:50px;font-style:italic" onclick="storeCaret('i')"> 
<input type="button" value="u" style="width:50px;text-decoration:underline" onclick="storeCaret('u')"> 
<input type="button" value="Couleur" onclick="storeCaret('color=(red|green|blue|yellow|purple|olive)')"> Choisi ta couleurs 
<br>

puis j'ai fais le formulaire:

Code :

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

1
2
3
4
5
6
7
 
<input type="text" name="titre"> 
Message :<br> 
    <textarea name="message" id="message" wrap="virtual" cols="100" rows="15"> </textarea> 
</center> 
 
    <input type="submit" name="Submit" value="Envoyer">

dans la page ou on recoit le $_POST['message'] j'ai les regex suivantes:
Code : PHP - Afficher / masquer les numéros de ligne

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
 
<?
if(!empty($titre) && !empty($message)) 
{ 
 
$titre = preg_replace('#\[b\](.+)\[/b\]#isU', '<strong>$1</strong>', $titre); 
    $titre = preg_replace('#\[i\](.+)\[/i\]#isU', '<em>$1</em>', $titre); 
    $titre = preg_replace('#\[color=(red|green|blue|yellow|purple|olive)\](.+)\[/color=(red|green|blue|yellow|purple|olive)\]#isU', '<span style="color:$1">$2</span>', $titre); 
    $titre = preg_replace('#<a href="http://[a-z0-9._/-]+#i" target="_blank">http://[a-z0-9._/-]+#i</a>', '<a href="$0">$0</a>', $titre); 
 
 
$message = preg_replace('#\[b\](.+)\[/b\]#isU', '<strong>$1</strong>', $message); 
    $message = preg_replace('#\[i\](.+)\[/i\]#isU', '<em>$1</em>', $message); 
    $message = preg_replace('#\[color=(red|green|blue|yellow|purple|olive)\](.+)\[/color=(red|green|blue|yellow|purple|olive)\]#isU', '<span style="color:$1">$2</span>', $message); 
    $message = preg_replace('#<a href="http://[a-z0-9._/-]+#i" target="_blank">http://[a-z0-9._/-]+#i</a>', '<a href="$0">$0</a>', $message);

ce qui ne va pas:

quand je clique sur le bouton "gras" les balises apparaissent et fonctionnent
(je dois inserer du texte entre les deux balises apparaissant )

mais quand je clique sur u(pour souligner) les balises apparaissent mais ne fonctionnent pas (en mettant du texte entre les balises, rien n'est souligné,les balises ne sont pas traduites)

de meme pour les couleurs:les balises apparaissent mais ne fonctionnent pas...

alors que pour mettre en italique,ca fonctionne...les balises apparaissent et fonctionnent....

vous savez pourquoi? merci

**SpaceFrog** · 09/04/2008, 14h49

tinyMCE tu connais ?

**cyril3d** · 09/04/2008, 14h54

...non...

ca sert a quoi et ou faut le mettre s'il te plais?

**SpaceFrog** · 09/04/2008, 14h56

http://tinymce.moxiecode.com/

ou un autre du style
http://www.unverse.net/whizzywig-cro...ml-editor.html

**cyril3d** · 09/04/2008, 14h58

merci, mais...mon code a moi fonctionne ( le gras et l'italique fonctionnent bien)

seul souligner et mettre en couleur ne fonctionne pas...

tu sais pourquoi? parceque tinycme ne peut pas repondre a ma question...

(a moins que j'aie vraiment pas compris...)

**cyril3d** · 09/04/2008, 15h00

mais...sinon, comment j'integre ce module a mon code?

because l'anglais et moi ca fait 2...

**SpaceFrog** · 09/04/2008, 15h05

tu downloade les script tu les colle dans un repertoire de ton site et tu fasi un script src ...
et hop deux lignes de code et c'est bon ...

**cyril3d** · 09/04/2008, 15h14

merci, alors si j'ai bien compris:

j'ai downoadé le script (1 page) de whizzywig...et apres, c est quoi cette histoire des deux lignes?

merci de m'aider c'est pile ce que j'ai besoin

**SpaceFrog** · 09/04/2008, 15h22

ben ils donnent tout le code sur le site ...
http://www.unverse.net/using-whizzywig-web-pages.html

**cyril3d** · 09/04/2008, 15h22

attends je vais plutot faire ca avec tinycme

je clique sur le lien

a droite y a marqué "download" j'appuie sur "get it now"

la il y a 9 liens. je les telecharges tous et les mets dans ma partie admin (la ou j'ai besoin de mon formulaire)

apres quesque je fais?

**SpaceFrog** · 09/04/2008, 15h26

http://wiki.moxiecode.com/index.php/...E:Installation

et t'as pas besoin des 9 !!

**cyril3d** · 09/04/2008, 15h32

...merci mais...je comprends pas l'anglais...

je sais que c'est un handicap majeur dans l'informatique, mais...voila...

bon bah tant pis,j'ai telecharger les 9 scripts...je les mets dans la meme partie que mon script newsletter.php et formulaire newsletter.php

et apres? comment je les integres a mon script?

parceque la j'ai beau lire,je trouve ca tres compliqué alors que je sais que c'est tres simple!!!

couleur dans un formulaire

JavaScript

Discussions similaires

Partager

Partager