PDA

View Full Version : Generate Code in Textarea



Ajay
09-16-2006, 06:00 AM
Hi,

I want to create a form which has some checkboxes and text field. Using these checkboxes I want to generate some code that would display in the Textarea.

Something similar to how Google Adsense generates the code.

I know how to do it via PHP. But, looking to do the same via JS. Any ideas?

djr33
09-16-2006, 06:39 AM
This won't be too helpful as I'm not expert with javascript, but basically.... here's an example:


<input type="checkbox" onClick="if (this.value != checked) {textarea.value = 'this is some code'} else {textarea.value = ''}">
<textarea id="textarea"></textarea>
<br><br><br>
<input type="checkbox" onClick="if (this.value != checked) {textbox.value = 'this is some code'} else {textbox.value = ''}">
<input type="text" id="textbox">

Now, it obviously gets more complex if you want it to do something like add code to the middle of what's already there, or change what's already there in some other way, etc. It's possible, just more work. If you get more complex than what's above, I'd recommend making a function and referring to it from the input checkbox...
<input type="checkbox" onClick="dostuff()">
(and define dostuff() as a function in the head section, between <script> tags)


Also, I'll note that I was a bit confused when writing this because I needed to use the id attribute on the fields, rather than name. Not sure why this is. (I'm using safari, so maybe that's part of it).

Note: It's "!= checked" because when you're clicking, it's the opposite of what it changes to, so the text should match the opposite of what you clicked.

shachi
09-16-2006, 06:56 AM
minor fix to drj33's code:



<input type="checkbox" onClick="if (this.checked != true) {textarea.value = 'this is some code'} else {textarea.value = ''}">
<textarea id="textarea"></textarea>
<br><br><br>
<input type="checkbox" onClick="if (this.checked != true) {textbox.value = 'this is some code'} else {textbox.value = ''}">
<input type="text" id="textbox">

djr33
09-16-2006, 07:42 AM
Is that just the "proper" way, or does it make it more compatible?
I just guessed and got it to work... I'm sure that's better... just wondering...

shachi
09-16-2006, 08:39 AM
drj33: I know that your version works but the difference between your version and my version is that in your version if the user checks the checkbox, it inserts the data into the textarea/textbox but when the user unchecks it, the data inserted will still be there. So, it depends on the OP how he wants it to be. :)

djr33
09-16-2006, 09:53 AM
Oh, well all you need to do is remove the else statement from mine.
I wasn't sure either.

Ajay
09-16-2006, 10:31 AM
Thanks djr33 and shachi.

I'm looking more in the likes of adding stuff inbetween.

Do you have Google Adsense? I want it similar to how they generate the code.

The text area will be a result of combinations of textboxes and checkboxes.

djr33
09-16-2006, 11:12 AM
It would be easy enough to do this:

textarea.value = "<html>"+textarea.value+"</html>"
However, to take those back out or to specify a particular location for somethign would involve analyzing the exact characters and would get compelx quickly.

Twey
09-16-2006, 12:39 PM
In both the examples above, the variables "textbox" and "textarea" are undefined.
<input type="checkbox" onclick="
var textarea = document.getElementById("textarea");
if (!this.checked)
textarea.value = 'this is some code';
else
textarea.value = '';
">
<textarea id="textarea"></textarea>
<input type="checkbox" onclick="
var textbox = document.getElementById("textbox");
if (!this.checked)
textbox.value = 'this is some code';
else
textbox.value = '';
">
<input type="text" id="textbox">

shachi
09-16-2006, 01:46 PM
Twey: I know that but it doesn't really matter does it?? I was too lazy to standardize it(and make it unobtrusive).;)

Twey
09-16-2006, 02:05 PM
Of course it does, you're using undefined variables :)

shachi
09-16-2006, 02:11 PM
But ... in one of the post you told me it didn't. :confused:

mburt
09-16-2006, 03:06 PM
Of course it does, you're using undefined variables
Thus making the code unusable.

Twey
09-16-2006, 03:09 PM
But ... in one of the post you told me it didn't. :confused:Where? :-\

It will probably work in most browsers due to the way they make elements accessible by name or ID under the global object, but there's nothing that says it ought to.

shachi
09-16-2006, 03:11 PM
Never mind, I searched the post but couldn't find it.

Ajay
09-17-2006, 07:37 PM
It would be easy enough to do this:

textarea.value = "<html>"+textarea.value+"</html>"
However, to take those back out or to specify a particular location for somethign would involve analyzing the exact characters and would get compelx quickly.

This is probably some solution I am looking for. Will have to research much deeper into how exactly I plan on working on this.

I'm thinking possibly an onblur will call a function that will reupdate the text field.