copying text from a string into an input field

adastra · 01-30-2007, 10:52 AM

Hi, I'm a total javascript noob, so I have a rather stupid question;

How can I copy a small text (tag) from a document into an input box? I want to create a simple tagging function for a news script, and above the input fields for the tags, I want to display all the existing tags. So the user can just click on a tag, and it's automatically entered into the input field, comma seperated.

Thanks in advance!

1212jtraceur · 01-31-2007, 03:21 AM

I'm not quite sure what you mean by the last sentence, but I'll take a shot at helping you:

A textarea's value and an input's value can be changed using the value property. An anchor (or a button) can do things using the onclick property. Putting those two together, you get:

PHP Code:


			
<textarea id="text"></textarea>

<input type="text" id="text2" />

<a href="#nowhere" onclick="document.getElementById('text').value += 'text1 '; document.getElementById('text2').value += 'text2 ';">click me</a>

ChanLFC · 01-31-2007, 07:38 AM

Hi adastra,

I think this is what you are looking for. Just try the following,

<html>
<head>
<style>
td { border:solid 1px red; cursor:hand; color:white; background:blue; font-weight:bold; font-family:Tahoma; font-size:10pt; }
</style>
<script>
function add(tag) { document.getElementById('txtA').value += tag + ", "; }
</script>
</head>
<body>
<span style="font-weight:bold; font-family:Tahoma; font-size:10pt; color:blue;">
Choose your favourite clubs
</span>
<table border="0" cellpadding="2" cellspacing="10">
<tr>
<td onclick="add(this.innerHTML);">Liverpool</td>
<td onclick="add(this.innerHTML);">Celtic</td>
<td onclick="add(this.innerHTML);">Inter</td>
<td onclick="add(this.innerHTML);">Bremen</td>
<td onclick="add(this.innerHTML);">Deportivo</td>
<td onclick="add(this.innerHTML);">Ajax</td>
<tr>
</table>
<textarea id="txtA" rows="10" cols="100">
</textarea>
</body>
</html>