473,467 Members | 1,549 Online
Bytes | Software Development & Data Engineering Community
Create Post

Home Posts Topics Members FAQ

listing words in a textbox using checkboxes

Hello,
Is it possible to dynamically update a textbox with words chosen from a
list using form checkboxes and javascript?
Gary
Jul 20 '05 #1
9 2950
Ivo
"Gary" <g.*****@shaw.ca> wrote in message
news:IVgYb.537154$ts4.42209@pd7tw3no...
Hello,
Is it possible to dynamically update a textbox with words chosen from a
list using form checkboxes and javascript?
Gary


I 'm not sure I understand what you want. The following would add (or
remove) the words to the output in the order the checkboxes are clicked. It
is not the only possibility.
<script type="text/javascript">
function listwords(c,n) {
s=document.f.out.value;
if (c.checked) {
if (s.indexOf(n)<0) s+=' '+n;
} else {
s=document.f.out.value.replace(' '+n,'');
}
document.f.out.value=s;
}
</script>
<form name="f" method="get" onsubmit="return false">
<input type="text" value="" name="out"><br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Word')">Word<br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Type')">Type<br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Other')">Other<br>
</form>
Jul 20 '05 #2

Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:IVgYb.537154$ts4.42209@pd7tw3no...
Hello,
Is it possible to dynamically update a textbox with words chosen
from a list using form checkboxes and javascript?
Gary


I 'm not sure I understand what you want. The following would add (or
remove) the words to the output in the order the checkboxes are
clicked. It is not the only possibility.
<script type="text/javascript">
function listwords(c,n) {
s=document.f.out.value;
if (c.checked) {
if (s.indexOf(n)<0) s+=' '+n;
} else {
s=document.f.out.value.replace(' '+n,'');
}
document.f.out.value=s;
}
</script>
<form name="f" method="get" onsubmit="return false">
<input type="text" value="" name="out"><br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Word')">Word<br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Type')">Type<br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Other')">Other<br>
</form>


Ivo,
That's exactly what I wanted! Thank-you for time and effort. I googled for
hours and couldn't find anything remotely related and you mention other
possibilities?
Thanks again!
Gary
Jul 20 '05 #3
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:IVgYb.537154$ts4.42209@pd7tw3no...
Hello,
Is it possible to dynamically update a textbox with words chosen
from a list using form checkboxes and javascript?
Gary


I 'm not sure I understand what you want. The following would add (or
remove) the words to the output in the order the checkboxes are
clicked. It is not the only possibility.
<script type="text/javascript">
function listwords(c,n) {
s=document.f.out.value;
if (c.checked) {
if (s.indexOf(n)<0) s+=' '+n;
} else {
s=document.f.out.value.replace(' '+n,'');
}
document.f.out.value=s;
}
</script>
<form name="f" method="get" onsubmit="return false">
<input type="text" value="" name="out"><br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Word')">Word<br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Type')">Type<br>
<input type="checkbox" name="check1"
onclick="listwords(this,'Other')">Other<br>
</form>


Would it be to much of a bother to ask how I can extend that script one
further? Say I wanted to take a second list of words and only allow the
option of inserting one word from that list in front of the list of words
inserted into the textbox using radio buttons ?
Gary
Jul 20 '05 #4
Ivo
"Gary" <g.*****@shaw.ca> wrote in message
news:NmCYb.550116$ts4.306481@pd7tw3no...
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:IVgYb.537154$ts4.42209@pd7tw3no...
Hello,
Is it possible to dynamically update a textbox with words chosen
from a list using form checkboxes and javascript?
Gary

(...)

Would it be to much of a bother to ask how I can extend that script one
further? Say I wanted to take a second list of words and only allow the
option of inserting one word from that list in front of the list of words
inserted into the textbox using radio buttons ?
Gary

It 's isn't getting any clearer what you are after, but this does as
requested. In the current design, all words have to be unique. I don't know
if that is a problem. and you need to specify the words in an array at the
start of the script, a bit clumsy. But with that, all that was needed was to
add two short "for" loops, the first removing anything like a radio'ed word,
the second adding the currently selected word. The process could be repeated
for other groups of words.

<script type="text/javascript">
var oneOf=new Array('One','Word','Only');
function listwords(c) {n=c.value;
s=document.f.out.value;
for(i=0;i<oneOf.length;i++) s=s.replace(' '+oneOf[i],'');
for(i=0;i<document.f.radio1.length;i++) {
a=document.f.radio1[i]; if(a.checked)s+=' '+a.value;
}
if (c.checked) {
if (s.indexOf(n)<0) s+=' '+n;
} else {
s=document.f.out.value.replace(' '+n,'');
}
document.f.out.value=s;
}
</script>
<form name="f" method="get" onsubmit="return false">
<input type="text" value="" name="out"><br>
<input type="checkbox" name="check1" value="More"
onclick="listwords(this)">More<br>
<input type="checkbox" name="check2" value="Than"
onclick="listwords(this)">Than<br>
<input type="checkbox" name="check3" value="Before"
onclick="listwords(this)">Before<br>

<input type="radio" name="radio1" value="One"
onclick="listwords(this)">One<br>
<input type="radio" name="radio1" value="Word"
onclick="listwords(this)">Word<br>
<input type="radio" name="radio1" value="Only"
onclick="listwords(this)">Only<br>

</form>
Jul 20 '05 #5
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:NmCYb.550116$ts4.306481@pd7tw3no...
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:IVgYb.537154$ts4.42209@pd7tw3no...
Hello,
Is it possible to dynamically update a textbox with words chosen
from a list using form checkboxes and javascript?
Gary
(...)

Would it be to much of a bother to ask how I can extend that script
one further? Say I wanted to take a second list of words and only
allow the option of inserting one word from that list in front of
the list of words inserted into the textbox using radio buttons ?
Gary

It 's isn't getting any clearer what you are after, but this does as
requested. In the current design, all words have to be unique. I
don't know if that is a problem. and you need to specify the words in
an array at the start of the script, a bit clumsy. But with that, all
that was needed was to add two short "for" loops, the first removing
anything like a radio'ed word, the second adding the currently
selected word. The process could be repeated for other groups of
words.


Ivo,
That is one nice revision! I don't think I expressed my needs as well as I
might have, but hopefully I will be able to modify the script without the
need to pester here. Thanks again for your help!
Gary
Jul 20 '05 #6
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:NmCYb.550116$ts4.306481@pd7tw3no...
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:IVgYb.537154$ts4.42209@pd7tw3no...
Hello,
Is it possible to dynamically update a textbox with words chosen
from a list using form checkboxes and javascript?
Gary
(...)

Would it be to much of a bother to ask how I can extend that script
one further? Say I wanted to take a second list of words and only
allow the option of inserting one word from that list in front of
the list of words inserted into the textbox using radio buttons ?
Gary

It 's isn't getting any clearer what you are after, but this does as
requested. In the current design, all words have to be unique. I
don't know if that is a problem. and you need to specify the words in
an array at the start of the script, a bit clumsy. But with that, all
that was needed was to add two short "for" loops, the first removing
anything like a radio'ed word, the second adding the currently
selected word. The process could be repeated for other groups of
words.

<script type="text/javascript">
var oneOf=new Array('One','Word','Only');
function listwords(c) {n=c.value;
s=document.f.out.value;
for(i=0;i<oneOf.length;i++) s=s.replace(' '+oneOf[i],'');
for(i=0;i<document.f.radio1.length;i++) {
a=document.f.radio1[i]; if(a.checked)s+=' '+a.value;
}
if (c.checked) {
if (s.indexOf(n)<0) s+=' '+n;
} else {
s=document.f.out.value.replace(' '+n,'');
}
document.f.out.value=s;
}
</script>
<form name="f" method="get" onsubmit="return false">
<input type="text" value="" name="out"><br>
<input type="checkbox" name="check1" value="More"
onclick="listwords(this)">More<br>
<input type="checkbox" name="check2" value="Than"
onclick="listwords(this)">Than<br>
<input type="checkbox" name="check3" value="Before"
onclick="listwords(this)">Before<br>

<input type="radio" name="radio1" value="One"
onclick="listwords(this)">One<br>
<input type="radio" name="radio1" value="Word"
onclick="listwords(this)">Word<br>
<input type="radio" name="radio1" value="Only"
onclick="listwords(this)">Only<br>

</form>


Ivo,
It doesn't look like that will work for me after all, if I haven't worn out
my welcome would it be possible for you to show me how I can "surround" the
list of words created from the checkboxes with "predefined" text selected
with radio buttons? i.e.:

words selected with checkboxes = one, two, three

<text from radio1 here>one, two, three</end text from radio1>
or
<text from radio2 here>one,two,three</end text from radio2>
Thanks in advance
Gary
Jul 20 '05 #7
Ivo
"Gary" <g.*****@shaw.ca> wrote in message
news:2xiZb.557886$JQ1.437459@pd7tw1no...
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:NmCYb.550116$ts4.306481@pd7tw3no...
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:IVgYb.537154$ts4.42209@pd7tw3no...

would it be possible for you to show me how I can "surround" the
list of words created from the checkboxes with "predefined" text selected
with radio buttons? i.e.:

words selected with checkboxes = one, two, three

<text from radio1 here>one, two, three</end text from radio1>
or
<text from radio2 here>one,two,three</end text from radio2>


There you are: function listwords version 3.0 below is really dirty: at each
click of the mouse the contents in the output field is completely erased and
rewritten. The order in which the boxes are checked no longer counts. I hope
that doesn't hurt,
Ivo

<script type="text/javascript">
function listwords(){
s='';
for(i=0;i<document.f.elements.length;i++){
a=document.f.elements[i];
if(a.type=='checkbox'&&a.checked)
s+=' '+a.value;
}
for(i=0;i<document.f.radio1.length;i++){
a=document.f.radio1[i];
if(a.checked){
b=a.value.split('|');
s=b[0]+s+' '+b[1];
}
}
document.f.out.value=s;
}
</script>
<form name="f" method="get" onsubmit="return false">
<input type="text" value="" name="out"><br>
<input type="checkbox" name="check1" value="More"
onclick="listwords()">More<br>
<input type="checkbox" name="check2" value="Than"
onclick="listwords()">Than<br>
<input type="checkbox" name="check3" value="Before"
onclick="listwords()">Before<br>
<input type="radio" name="radio1" value="&lt;|&gt;"
onclick="listwords()">Symbol<br>
<input type="radio" name="radio1" value="alpha|omega"
onclick="listwords()">Word<br>
<input type="radio" name="radio1" value="The first|will be the last."
onclick="listwords()">Sentence<br>
</form>
Jul 20 '05 #8
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:2xiZb.557886$JQ1.437459@pd7tw1no...
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:NmCYb.550116$ts4.306481@pd7tw3no...
Ivo wrote:
> "Gary" <g.*****@shaw.ca> wrote in message
> news:IVgYb.537154$ts4.42209@pd7tw3no... would it be possible for you to show me how I can "surround" the
list of words created from the checkboxes with "predefined" text
selected with radio buttons? i.e.:

words selected with checkboxes = one, two, three

<text from radio1 here>one, two, three</end text from radio1>
or
<text from radio2 here>one,two,three</end text from radio2>


There you are: function listwords version 3.0 below is really dirty:
at each click of the mouse the contents in the output field is
completely erased and rewritten. The order in which the boxes are
checked no longer counts. I hope that doesn't hurt,
Ivo


Ivo,
Sorry about the delayed response, busy day yesterday.
Version 3.0 is almost picture perfect, for two of three radio buttons it
doesn't matter if the output field is erased and rewritten but for the
third radio button I need to allow the user to type text and choose
applicable checkboxes as required without erasing the text they have already
entered. Is that possible? As you have probably figured out my javascript
skills are extremely limited and I'm glad for the help you have offered
Gary

<script type="text/javascript">
function listwords(){
s='';
for(i=0;i<document.f.elements.length;i++){
a=document.f.elements[i];
if(a.type=='checkbox'&&a.checked)
s+=' '+a.value;
}
for(i=0;i<document.f.radio1.length;i++){
a=document.f.radio1[i];
if(a.checked){
b=a.value.split('|');
s=b[0]+s+' '+b[1];
}
}
document.f.out.value=s;
}
</script>
<form name="f" method="get" onsubmit="return false">
<input type="text" value="" name="out"><br>
<input type="checkbox" name="check1" value="More"
onclick="listwords()">More<br>
<input type="checkbox" name="check2" value="Than"
onclick="listwords()">Than<br>
<input type="checkbox" name="check3" value="Before"
onclick="listwords()">Before<br>
<input type="radio" name="radio1" value="&lt;|&gt;"
onclick="listwords()">Symbol<br>
<input type="radio" name="radio1" value="alpha|omega"
onclick="listwords()">Word<br>
<input type="radio" name="radio1" value="The first|will be the last."
onclick="listwords()">Sentence<br>
</form>

Jul 20 '05 #9
I've added a function to select/deselect all checkboxes to the script below
in the form of:
function checkAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = true ;
}

function uncheckAll(field)
{
for (i = 0; i < field.length; i++)
field[i].checked = false ;
}
<input type="button" name="CheckAll" value="Check All"
onClick="checkAll(document.f.check1)">
<input type="button" name="UnCheckAll" value="Uncheck All"
onClick="uncheckAll(document.f.check1)">

my only problem is that the list items don't show in the textbox after using
the above function until a radio button is selected again. Have I missed
something in the original javascript that I can add to the "checkAll" and
"uncheckAll" functions that will update the textbox with all items in the
list?
TIA
Gary

Gary wrote:
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:2xiZb.557886$JQ1.437459@pd7tw1no...
Ivo wrote:
"Gary" <g.*****@shaw.ca> wrote in message
news:NmCYb.550116$ts4.306481@pd7tw3no...
> Ivo wrote:
>> "Gary" <g.*****@shaw.ca> wrote in message
>> news:IVgYb.537154$ts4.42209@pd7tw3no...
would it be possible for you to show me how I can "surround" the
list of words created from the checkboxes with "predefined" text
selected with radio buttons? i.e.:

words selected with checkboxes = one, two, three

<text from radio1 here>one, two, three</end text from radio1>
or
<text from radio2 here>one,two,three</end text from radio2>


There you are: function listwords version 3.0 below is really dirty:
at each click of the mouse the contents in the output field is
completely erased and rewritten. The order in which the boxes are
checked no longer counts. I hope that doesn't hurt,
Ivo


Ivo,
Sorry about the delayed response, busy day yesterday.
Version 3.0 is almost picture perfect, for two of three radio buttons
it doesn't matter if the output field is erased and rewritten but
for the third radio button I need to allow the user to type text and
choose applicable checkboxes as required without erasing the text
they have already entered. Is that possible? As you have probably
figured out my javascript skills are extremely limited and I'm glad
for the help you have offered Gary

<script type="text/javascript">
function listwords(){
s='';
for(i=0;i<document.f.elements.length;i++){
a=document.f.elements[i];
if(a.type=='checkbox'&&a.checked)
s+=' '+a.value;
}
for(i=0;i<document.f.radio1.length;i++){
a=document.f.radio1[i];
if(a.checked){
b=a.value.split('|');
s=b[0]+s+' '+b[1];
}
}
document.f.out.value=s;
}
</script>
<form name="f" method="get" onsubmit="return false">
<input type="text" value="" name="out"><br>
<input type="checkbox" name="check1" value="More"
onclick="listwords()">More<br>
<input type="checkbox" name="check2" value="Than"
onclick="listwords()">Than<br>
<input type="checkbox" name="check3" value="Before"
onclick="listwords()">Before<br>
<input type="radio" name="radio1" value="&lt;|&gt;"
onclick="listwords()">Symbol<br>
<input type="radio" name="radio1" value="alpha|omega"
onclick="listwords()">Word<br>
<input type="radio" name="radio1" value="The first|will be the last."
onclick="listwords()">Sentence<br>
</form>

Jul 20 '05 #10

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

1
by: Jose Gonzalez | last post by:
How to apply a numeric format to a textbox using xhtml? I know you have to use the "-wap-input-format" style tag in css. I can get this to work in a regular xhtml page, however, I've been...
3
by: Ricardo Corsi P. Cesar | last post by:
I have many textbox in my webform, but i want clear all of them with on single step. Someone have the code ? Thks
3
by: Mark | last post by:
I am looking for an example of using checkboxes in a repeater control where the checkbox state is persisted from page to page. Thank you, Mark
1
by: PJ6 | last post by:
How do I select a subset of text in a textbox using JavaScript? Paul
2
by: Gautam | last post by:
ex: I have a color in RGB component say 255,0,0 ie red. now i want to set the back color of a textbox using this RGB component txtColorBox.BackColor = ?????? Any suggestions??? -Gautam
0
by: shameem | last post by:
hi 2 all, my question is how to delete the records by using checkboxes in datagrid. pls give reply to my question.
1
by: mirasol | last post by:
i am new here,i just want to ask question about uploading file with textbox using mysql and php, i used the codes given by some member and my problem is i dont know how to add textbox and i want it...
2
by: s k parimal | last post by:
How to validate decimal value in textbox using C#? I am using this (^(*|\d*\d{1}?\d*)$) but it not working help
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new...
0
by: conductexam | last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and...
0
by: 6302768590 | last post by:
Hai team i want code for transfer the data from one system to another through IP address by using C# our system has to for every 5mins then we have to update the data what the data is updated ...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.