PHPhulp.nl PHPhulp.nl
35k+ leden Over PHPhulp Offerte opdracht Contact
j

text ingeven via javascript

Door jvuz op 27-07-2006 15:45
1.171 views
Hallo ik heb een form die via php/mysql naar een db gestuurd wordt. In het veld event (textarea) zou ik graag willen dat het mogelijk wordt om via een knop (door erop te klikken, eigenlijk zoals de ubb code op een forum) hetvolgende in te voeren:
<br />
<b></b>
Ik denk dat dat via Javascript zal moeten gebeuren. Of wat denken jullie?
Jan Koehoorn
28-07-2006 13:40
Hier heb je een voorbeeldscript. Getest en werkend:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
	<title></title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
	<script type="text/javascript">
		window.onload = init;
		
		function init () {
			var _newline = document.getElementById ('newline');
			_newline.onclick = set_newline;
		}
		
		function set_newline () {
			var _tekst = document.getElementById ('tekst');
			_tekst.value += " stukje erbij...";
		}
	</script>
</head>

<body>
	<form method="post">
		<p>
			<textarea id="tekst"></textarea>
		</p>
		<p>
			<input id="newline" type="button">
		</p>
	</form>
</body>
</html>
j
jvuz
28-07-2006 13:45
Prachtig, het werkt, nu kan ik toevoegen wat ik wil! Nogmaals bedankt!
j
jvuz
28-07-2006 13:56
Als ik dit doe werkt het niet.

<script type="text/javascript">
        window.onload = init;
        
        function init () {
            var _newline = document.getElementById ('newline');
            _newline.onclick = set_newline;
            var _bold = document.getElementById ('bold');
            _bold.onclick = set_bold;
        }
        
        function set_newline () {
            var _tekst = document.getElementById ('event');
            _tekst.value += " <br />";
        }
        function set bold () {
	        var_tekst = document.getElementById ('event');
	        _tekst.value += "<b><\/b>";
    </script>

Moet ik de nieuwe variabele anders declareren?
Jan Koehoorn
28-07-2006 14:00
Er hoort een streepje in je functienaam set bold en die staat er niet.
j
jvuz
28-07-2006 14:04
Inderdaad, newline werkt terug, maar de bold functie wil nog niet werken. Ik heb er een \ toegevoegd, omdat ik een foutboodschap kreeg ivm de validatie. Zit daar het probleem?

Dit zijn de buttons:

<input id="newline" type="button" value="Nieuwe regel" />
<input id="bold" type="button" value="Vetgedrukt" />
Joren de Wit
28-07-2006 14:11
Ikzelf ben een voorstander van deze code, aangezien de javascript functie die gebruikt wordt nog iets algemener is:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">        
        function addText (target, value) {
			_target = document.getElementById (target);
            _target.value += value;
        }
    </script>
</head>

<body>
    <form method="post">
        <p>
            <textarea id="tekst"></textarea>
        </p>
        <p>
            <input id="newline" value="newline" onClick="addText('tekst','<br />')" type="button">
			<input id="bold" value="bold" onClick="addText('tekst','<b></b>')" type="button">
        </p>
    </form>
</body>
</html>


Getest en werkend. Bij elke button geef je een onClick waarde mee waarin je addText aanroept. Op zijn beurt verlangt addText weer een target en een waarde...

[edit] typo[/edit]
Jan Koehoorn
28-07-2006 14:18
@Blanche: die is inderdaad nog iets mooier, als je meer buttons nodig hebt.

Het wordt nog weer mooier als je het toekennen van de functies aan de buttons uit de HTML haalt en in de JavaScript sectie doet. Op die manier kun je namelijk je HTML(PHP), CSS en JS helemaal gescheiden houden.
Joren de Wit
28-07-2006 14:28
Hehe klopt, we komen er wel uiteindelijk :P
j
jvuz
28-07-2006 14:35
Jullie zijn geweldig! Ik moet wel zeggen dat ik nog niet zover ben, betreffende de laatste comment van Jan. Ik ben al blij dat ik dit heb. Nogmaals bedankt.

Reageren

Inloggen om te reageren