BBCode [Résolu]

Signaler
Messages postés
9
Date d'inscription
mardi 15 mai 2007
Statut
Membre
Dernière intervention
10 août 2009
-
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
-
Alors voià, ca fait un bout de temps que je me penche sur ce sujet mais n'étant que débutant en matière de Javascript, je n'arrive pas à réaliser mon BBcode.
J'ai un formulaire dans lequel je voudrai pouvoir donner la possiblité aux utilisateurs de poster des commentaires mis en forme avec des balises créées en cliquant sur un bouton.
Ex : l'ulisateur sélectionne le texte et veut le mettre en gras, il clique sur le bouton B et le texte sélectionné se met entre les balises .

Voilà mon formulaire :

<form name= "ajout" action="ma page ou est dirigée l'info" method= "post">

Titre :

fonction pour mettre en forme le texte à chaque sélection de texte :

Ma zone de texte :
<textarea cols ="62" rows="15" name="texte"></textarea>

</form>

Merci d'avance pour votre aide .

20 réponses

Messages postés
246
Date d'inscription
vendredi 24 novembre 2006
Statut
Membre
Dernière intervention
21 décembre 2007
2
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
38
Salut
<html>
<head>
<title>BB-CODE séléction</title>
</head>
<body>
<textarea id="texte"></textarea>
<input type="button" value="get selection"
onclick="alert(cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart)))" />
<input type="button" onclick="Addurl();" value="ajouter lien" />
<script type="text/javascript">
cform=document.getElementById('texte');
function Addurl(){
cform.value = cform.value.substr(0,cform.selectionStart) +
'[URL ' + prompt('URL : ','http://')+']' +
cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart)) +
'/URL' +
cform.value.substr(cform.selectionEnd, cform.lenght - cform.selectionEnd);
}
</script>
</body>
</html>

voila, t'as un exemple adaptable

<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
246
Date d'inscription
vendredi 24 novembre 2006
Statut
Membre
Dernière intervention
21 décembre 2007
2
Messages postés
9
Date d'inscription
mardi 15 mai 2007
Statut
Membre
Dernière intervention
10 août 2009

Bonjour coucou747,

Ton exemple ne m'apporte pas plus d'infos sur la façon d'ajouter des balises telles que ,  autour du texte sélectionné lorsque je clique sur mon bouton B,I ...
Il me dit juste la façon d'ajouter un lien dans mon formulaire avec un message prédéfini dans le prompteur .

Merci quand même pour ton aide qui ne m'aide pas beaucoup sur la fonction gras(), italic(), ...
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
32
Bonjour,

PetOleTeam a fait : http://www.javascriptfr.com/codes/CURSEUR-DANS-TEXTAREA_39612.aspx
    et c'est superbe.

mais pourquoi encore faire du BBCode, alors qu'une foultitude de
    saisie WYSIWIG sont disponibles ? c'est beaucoup plus agréable !
    un ch'tit exemple ?
         http://www.javascriptfr.com/codes/MISE-FORME-TEXTE-SAISIE-WYSIWYG_32583.aspx
    c'est le mien, mais il y en a d'autres, ne serait-ce que celui de CodesSources.. et ailleurs aussi.

<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
38
Salut

....
alors la j'y crois pas....

t'as
function Addurl(){
cform.value = cform.value.substr(0,cform.selectionStart) +
'[URL ' + prompt('URL : ','http://')+']' +
cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart)) +
'/URL' +
cform.value.substr(cform.selectionEnd, cform.lenght - cform.selectionEnd);
}
ce qui t'indique CLAIREMENT comment recuperer les parties selectionnees, les parties avant et apres...

function Gras(){
cform.value = cform.value.substr(0,cform.selectionStart) +
'[b]' +
cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart)) +
'/b' +
cform.value.substr(cform.selectionEnd, cform.lenght - cform.selectionEnd);
}

j'ai change beaucoup de choses ???

<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
38
bultez,

tu as tape 16 snippets, (j'ai reregarde pour l'ocasion, mais je savais que t'en avais fait), t'aimes bien leur interface wysiwyg pour poster ta source ? c'est super agreable de colorer manuellement...

T'as un monde entre latex et word, pour ne citer que les meilleurs de chaque monde, dans le monde du web, BBcode serait l'equivalent de latex, et word des wysiwygs, certains wysiwygs sont tres bien, mais peu permettent de poster un code colore facilement, de pouvoir editer facilement ce code, de pouvoir ajouter des equations mathematiques, de pouvoir [...] T'as du bon dans les deux mondes, mais le wysiwyg ne peut pas plaire a tout le monde (sur mon site, j'avais les code les deux modes d'editions), enfin tu comprends bien qu'editer son code source comme ca, le reprendre quelques temps apres, l'avoir colore en ligne :) c'est du bonheur... apres, c'est sur que repondre sur un forum avec un wysiwyg, c'est tout aussi bon, mais pour une autre application...

<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
32
>>dans le monde du web, BBcode serait l'equivalent de latex, et word des wysiwygs

>>le wysiwyg ne peut pas plaire a tout le monde
    certes. c'était juste une info pour notre Gourou, au cas où il ne connaitrait pas...



<hr />



Cordialement            Bul     [mon Site]     [M'écrire]



<hr />
Messages postés
9
Date d'inscription
mardi 15 mai 2007
Statut
Membre
Dernière intervention
10 août 2009

Alors je réexplique mon souci.
J'ai essayé de prendre la valeur sélectionnée par l'utilisateur :

 <script language="javascript">
 function gras()
 {
        sel = document.selection.createRange().text;
        sel = ''+sel+'';
        alert(sel);
 }
 </script>

L' alert(sel); retourne avec le texte sélectionné à l'intérieur comme je voulais qu'il apparaisse tout simplement dans ma balise mais je n'arrive justement pas à le réafficher dans ma zone textearea.

C'est jsute ce que je voulais au fond !
Pouvez vous m'aider sur ce problème ?
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
32
l'exemple de PetOleTeam... fait voir ça.
compatible IE, FF et les autres.
<hr />


Cordialement            Bul     [mon Site]     [M'écrire]



<hr />
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
32
    à yousfane...
    pourquoi citer un autre site alors que le même chose
        ( en beaucoup mieux ! ) existe sur CodesSources ?
<hr />


Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
Messages postés
246
Date d'inscription
vendredi 24 novembre 2006
Statut
Membre
Dernière intervention
21 décembre 2007
2
Salut
j'ai trouvé cette source hier, alors pas besoin de chercher une autre source sur CodesSources
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
38
Salut

je repondais juste a :

pourquoi encore faire du BBCode, alors qu'une foultitude de
    saisie WYSIWIG sont disponibles ?

<html>
<head>
<title>BB-CODE séléction</title>
</head>

<textarea id="texte" width="100%"></textarea>

<script type="text/javascript">
    cform=document.getElementById('texte');
    function Addurl(){
        var end=cform.value.substr(cform.selectionEnd);
        var start=cform.value.substr(0,cform.selectionStart);
        var middle=cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart));
        cform.value =  start+'[URL ' + prompt('URL : ','http://')+']' +    middle + '/URL' +end;
    }
    function bold(){
        var end=cform.value.substr(cform.selectionEnd);
        var start=cform.value.substr(0,cform.selectionStart);
        var middle=cform.value.substr(cform.selectionStart,(cform.selectionEnd-cform.selectionStart));
        cform.value =  start+'' +    middle + '' +end;
    }
</script>

</html>

j'avais une petite erreur sur la recuperation du texte qui suit la selection... (la je crois que tu as toutes les cartes en main...)

<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
246
Date d'inscription
vendredi 24 novembre 2006
Statut
Membre
Dernière intervention
21 décembre 2007
2
Salut


Moi je suis avec bultez, le wysiwig est mieux que le bbcode
Messages postés
13616
Date d'inscription
jeudi 13 février 2003
Statut
Membre
Dernière intervention
15 octobre 2013
32
>>ça existe sur
CodesSources ( comme presque toujours )
    inutile de chercher ailleurs.



<hr />



Cordialement                Bul     [mon Site]     [M'écrire]



<hr />
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
38
Salut

j'adore le commentaire "Re : BBCode
par : [auteurdetail.aspx?ID=918794 yousfane]
le 06/06/2007 12:21:25 "
moi j'ai pose des arguments qui expliquent que le BBcode a toujours sa place sur le net... ton commentaire n'a aucun argument, et ne dit meme pas dans quel cadre tu le preferes...

<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
246
Date d'inscription
vendredi 24 novembre 2006
Statut
Membre
Dernière intervention
21 décembre 2007
2
Salut

je n'ai pas dit que le BBcode n'est pas bon, mais moi je préfères wysiwig .
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
38
Salut

dire ca, c'est un peu comme si tu disais "moi je preferes la dinde aux gateaux au chocolats", ca n'a pas la meme utilite... sur mon vieux site (paie a son ame), je postais les news en wysiwyg, et les tutos / explications de codes en BBcode, ca a ses avantages...
<hr />une recherche sur exalead vous aurait peut-etre evite de poser cette question

In a dream, I saw me, drop dead...
U were there, U cried...
It was just a dream,
if I die, U won't cry, maybe, U'll be happy
Messages postés
246
Date d'inscription
vendredi 24 novembre 2006
Statut
Membre
Dernière intervention
21 décembre 2007
2
Salut


A chaque un des deux ses avantages.
Messages postés
12303
Date d'inscription
mardi 10 février 2004
Statut
Modérateur
Dernière intervention
30 juillet 2012
38
c'est ce que je dis depuis le debut...