smilies en ubb
Ik ben bezig met een vrij eenvoudig gastenboek, dit maakt gebruikt van smilies ( :) :( ;) en :@ ) maar ook van ubb code ( B I U ).
Goed, als ik het gewoon handmatig in voer in mijn veld "bericht" dan geeft hij de smilies enz mooi weer na het posten. Bij ubb het zelfde.
Nu heb ik boven mijn veld van "bericht" de smilies en de ubb images staan. nu wil ik dat als je op een smilie klikt de code van de smilie in het veld komt te staan
bv.
Emotei blij => klik => :) in het veld
Bij de ubb moet het dan bv. zijn dat als je op B drukt er [. b ] [/ b] in het veld komt te staan ( zonder spatie natuurlijk maar dat doe ik omdat anders mijn tekst hier bold word xD )
Kan iemand mij helpen hiermee ?
dank bij voor daad
MVG,
Joren
edit : ook zonder die . binnen [ ] , staat er om dat de tekst toch bold werd !
Gewijzigd op 01/01/1970 01:00:00 door Joren vh
dit is de image:
<img style="cursor:hand;" src="images/b.png" alt="Text met bold" onclick="javascript:icon('bold text ')">
en dit zet je in de <head>
<script type="text/javascript">
function icon(theicon)
{
document.formulier.bericht.value += ""+theicon;
document.formulier.bericht.focus();
}
</script>
oja je formulier moet de name formulier hebben en je bericht de name bericht
Gewijzigd op 01/01/1970 01:00:00 door marc
Stukje van mijn code :
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<script language="JavaScript" type="text/javascript">
function icon(theicon)
{
document.formulier.bericht.value += ""+theicon;
document.formulier.bericht.focus();
}
</script>
function icon(theicon)
{
document.formulier.bericht.value += ""+theicon;
document.formulier.bericht.focus();
}
</script>
Dat staat in mijn head !
Code (php)
1
2
3
2
3
<?php
echo '<img style="cursor:hand;" src="images/ubb/text_bold.png" alt="bold" onclick="javascript:icon('bold text ') /> .......';
?>
echo '<img style="cursor:hand;" src="images/ubb/text_bold.png" alt="bold" onclick="javascript:icon('bold text ') /> .......';
?>
dit staat boven mijn veld van "bericht"
....... is omdat de echo nog verder door loopt ( ander images waar ik nog niets veranderd heb ! )
Al vast bedankt,
Joren
edit :
even
Code (php)
1
<?php en ?>
Gewijzigd op 01/01/1970 01:00:00 door joren vh
Code (php)
1
<img src="smilies/happy.png" alt="Happy Face" onclick="document.getElementById('id_van_textarea').value += ':)'" />
Voor de UBB tags zou je eens naar onderstaand voorbeeld kunnen kijken. Die javascript oplossing werkt ook als je een stuk tekst selecteert, de tags worden er dan omheen geplaatst:
UBB tags toevoegen aan textarea
Gewijzigd op 01/01/1970 01:00:00 door Joren de Wit
Code (php)
1
<img src="images/smilies/blij.gif" alt="blij" onclick="document.getElementById('bericht').value += ':)'" />
doe ik nu maar dan geeft hij een witte pagina.
hier onder even mijn hele form
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
<?php
//het formuliertje
echo '<form action=" '.$_SERVER['PHP_SELF'].' " method="post">';
echo '<table border="0">';
echo '<tr>';
echo '<td> naam :</td> <td><input type="text" name="naam" size="30"></td><br />';
echo '</tr>';
echo '<tr>';
echo '<td>e-mail : </td><td><input type="text" name="mail" size="30"></td><br />';
echo '</tr>';
echo '<tr>';
echo '<td> </td><td><img src="images/smilies/blij.gif" alt="blij" onclick="document.getElementById(\'bericht\').value += \':)\'" /> <img src="images/smilies/droevig.gif" alt="droevig" /> <img src="images/smilies/knipoog.gif" alt="knipoog" /> <img src="images/smilies/boos.gif" alt="boos" /><br />';
echo '<img src="images/ubb/text_bold.png" alt="bold" /> <img src="images/ubb/text_italic.png" alt="schuin" /> <img src="images/ubb/text_underline.png" alt="onderlijnd" /></td><br />';
echo '</tr>';
echo '<tr>';
echo '<td>Bericht :</td><td> <textarea name="bericht" rows="10" cols="20"></textarea></td><br />';
echo '</tr>';
echo '<tr>';
echo '<td> </td><td><input type="submit" name="submit" value="Versturen"></td>';
echo '</tr>';
echo '</table>';
echo '</form>';
?>
//het formuliertje
echo '<form action=" '.$_SERVER['PHP_SELF'].' " method="post">';
echo '<table border="0">';
echo '<tr>';
echo '<td> naam :</td> <td><input type="text" name="naam" size="30"></td><br />';
echo '</tr>';
echo '<tr>';
echo '<td>e-mail : </td><td><input type="text" name="mail" size="30"></td><br />';
echo '</tr>';
echo '<tr>';
echo '<td> </td><td><img src="images/smilies/blij.gif" alt="blij" onclick="document.getElementById(\'bericht\').value += \':)\'" /> <img src="images/smilies/droevig.gif" alt="droevig" /> <img src="images/smilies/knipoog.gif" alt="knipoog" /> <img src="images/smilies/boos.gif" alt="boos" /><br />';
echo '<img src="images/ubb/text_bold.png" alt="bold" /> <img src="images/ubb/text_italic.png" alt="schuin" /> <img src="images/ubb/text_underline.png" alt="onderlijnd" /></td><br />';
echo '</tr>';
echo '<tr>';
echo '<td>Bericht :</td><td> <textarea name="bericht" rows="10" cols="20"></textarea></td><br />';
echo '</tr>';
echo '<tr>';
echo '<td> </td><td><input type="submit" name="submit" value="Versturen"></td>';
echo '</tr>';
echo '</table>';
echo '</form>';
?>
Al vast bedankt
Joren
Edit:
Als ik dat stukje van onclick ... verwijder krijg ik terug mijn gastenboek te zien.
Geen errors als het er wel staat, gewoon witte pagina !
Als ik dat stukje van onclick ... verwijder krijg ik terug mijn gastenboek te zien.
Geen errors als het er wel staat, gewoon witte pagina !
Edit:
code block 2 geupdate !
code block 2 geupdate !
Gewijzigd op 01/01/1970 01:00:00 door joren vh
getElementById('bericht').value
dus
getElementById(\'bericht\').value
Code (php)
1
onclick="document.getElementById(\'berich\').value += \':)\'"
Gewijzigd op 01/01/1970 01:00:00 door Joren de Wit
Voor mijn code kijk je hier boven even ik update hem zo ( 20 sec na deze post )
al vast bedankt
joren
dat lijkt mij wat makkelijke en overzichtelijke
Gewijzigd op 01/01/1970 01:00:00 door marc
@marc
Geprobeert maar dan ging er wat mis. Dus laat ik het zo !
Code (php)
1
2
3
2
3
<?php
echo '<td>Bericht :</td><td> <textarea id="bericht" name="bericht" rows="10" cols="20"></textarea></td><br />';
?>
echo '<td>Bericht :</td><td> <textarea id="bericht" name="bericht" rows="10" cols="20"></textarea></td><br />';
?>
Enkel nu ik een id heb gegeven aan mijn textarea word de kleur van het vak grijs ? gewoon even een div maken in mijn style met een andere kleur ?
Nu ga ik even naar die tut van je kijken blanche voor de ubb
Maar ik heb een vraagje over dat stukje van ubb .
Ik zet in mijn head wat jij doet. Wel even wat gewijzigd , linebreak weg. maar nu zie ik dat jij het doet met een form en en input type="button" .
Is er geen mogelijkheid dat dit gewoon met mijn images kan ?
dat ik het bv. ook gewoon via een id gaat of zo
Dank,
Joren
ps. Offtopic: wel grappig trouwens om eens een naamgenoot tegen te komen (ik heet ook Joren). Dat heb ik niet vaak...
Code (php)
1
2
3
2
3
<?php
echo '<img src="images/ubb/text_bold.png" alt="bold" id="bold" /> <img src="images/ubb/text_italic.png" alt="schuin" id="italic" /> <img src="images/ubb/text_underline.png" alt="onderlijnd" id="underline" /></td><br />';
?>
echo '<img src="images/ubb/text_bold.png" alt="bold" id="bold" /> <img src="images/ubb/text_italic.png" alt="schuin" id="italic" /> <img src="images/ubb/text_underline.png" alt="onderlijnd" id="underline" /></td><br />';
?>
heb ik nu maar hij doet het niet hoor.
Ik post even het stukje van je script dat ik heb aangepast.
Code (php)
1
2
3
4
2
3
4
$('bold').addEvent('click', makeBold);
$('italic').addEvent('click', makeItalic);
$('underline').addEvent('click', makeUnderline);
$('link').addEvent('click', makeLink);
$('italic').addEvent('click', makeItalic);
$('underline').addEvent('click', makeUnderline);
$('link').addEvent('click', makeLink);
link word wel niet gebruikt.
Als ik nu klik op bv. bold dan word er niets in het vak bericht geplaatst.
Al vast bedankt als je ziet wat ik toch nog mis doe.
Joren
offtopic
Ja ik kom het ook niet vaak tegen, dat je joren heet wist ik al een tijdje heb je vroeger ( maandje terug ) ook al eens in een topic gezegt xD
Edit:
ik ga even eten, tot zo !
ik ga even eten, tot zo !
Gewijzigd op 01/01/1970 01:00:00 door joren vh
Deze regel:
Code (php)
1
<script type="text/javascript" src="../../inc/mootools.js"></script>
mag dus niet ontbreken in je head. Natuurlijk moet je de src wel even aanpassen naar je eigen situatie. Het betreffende JS bestand heb ik hier online staan...
ps. Dat stukje code dat je nu gepost hebt, hangt enkel een aantal functies aan het onclick event van die elementen. Die functies kun je ook in het voorbeeld vinden, die moet je dus ook in je script opnemen.
Gewijzigd op 01/01/1970 01:00:00 door Joren de Wit
Oke ik kijk even in het voorbeeld
Edit:
Dat oneclickevent vind ik toch nergens terug hoor :s
Het stukje is geinclude
Dat oneclickevent vind ik toch nergens terug hoor :s
Het stukje is geinclude
thx al
Gewijzigd op 01/01/1970 01:00:00 door joren vh