Velocity Reviews - Computer Hardware Reviews

Velocity Reviews > Newsgroups > Programming > Javascript > listing words in a textbox using checkboxes

Reply
Thread Tools

listing words in a textbox using checkboxes

 
 
Gary
Guest
Posts: n/a
 
      02-17-2004
Hello,
Is it possible to dynamically update a textbox with words chosen from a
list using form checkboxes and javascript?
Gary


 
Reply With Quote
 
 
 
 
Ivo
Guest
Posts: n/a
 
      02-17-2004
"Gary" <> 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>


 
Reply With Quote
 
 
 
 
Gary
Guest
Posts: n/a
 
      02-17-2004

Ivo wrote:
> "Gary" <> 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


 
Reply With Quote
 
Gary
Guest
Posts: n/a
 
      02-18-2004
Ivo wrote:
> "Gary" <> 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


 
Reply With Quote
 
Ivo
Guest
Posts: n/a
 
      02-18-2004
"Gary" <> wrote in message
news:NmCYb.550116$ts4.306481@pd7tw3no...
> Ivo wrote:
> > "Gary" <> 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>


 
Reply With Quote
 
Gary
Guest
Posts: n/a
 
      02-19-2004
Ivo wrote:
> "Gary" <> wrote in message
> news:NmCYb.550116$ts4.306481@pd7tw3no...
>> Ivo wrote:
>>> "Gary" <> 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


 
Reply With Quote
 
Gary
Guest
Posts: n/a
 
      02-20-2004
Ivo wrote:
> "Gary" <> wrote in message
> news:NmCYb.550116$ts4.306481@pd7tw3no...
>> Ivo wrote:
>>> "Gary" <> 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


 
Reply With Quote
 
Ivo
Guest
Posts: n/a
 
      02-20-2004
"Gary" <> wrote in message
news:2xiZb.557886$JQ1.437459@pd7tw1no...
> Ivo wrote:
> > "Gary" <> wrote in message
> > news:NmCYb.550116$ts4.306481@pd7tw3no...
> >> Ivo wrote:
> >>> "Gary" <> 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>


 
Reply With Quote
 
Gary
Guest
Posts: n/a
 
      02-22-2004
Ivo wrote:
> "Gary" <> wrote in message
> news:2xiZb.557886$JQ1.437459@pd7tw1no...
>> Ivo wrote:
>>> "Gary" <> wrote in message
>>> news:NmCYb.550116$ts4.306481@pd7tw3no...
>>>> Ivo wrote:
>>>>> "Gary" <> 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>



 
Reply With Quote
 
Gary
Guest
Posts: n/a
 
      02-29-2004
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" <> wrote in message
>> news:2xiZb.557886$JQ1.437459@pd7tw1no...
>>> Ivo wrote:
>>>> "Gary" <> wrote in message
>>>> news:NmCYb.550116$ts4.306481@pd7tw3no...
>>>>> Ivo wrote:
>>>>>> "Gary" <> 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>



 
Reply With Quote
 
 
 
Reply

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are Off


Similar Threads
Thread Thread Starter Forum Replies Last Post
Replace stop words (remove words from a string) BerlinBrown Python 6 01-17-2008 02:37 PM
Alternative to Checkboxes and Radio Buttons - Click on Words thatHighlight Roger Javascript 2 03-25-2007 06:49 PM
Words Words utab C++ 6 02-16-2006 07:00 PM
Non-noise words are incorrectly recognised as noise words. Peter Strĝiman ASP .Net 1 08-23-2005 01:26 PM
Re: A little bit of help regarding my linked list program required. - "words.c" - "words.c" Richard Heathfield C Programming 7 10-05-2003 02:38 PM



Advertisments
 



1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57