PDA

Click to See Complete Forum and Search --> : Checkbox questions

zebdaag
12-03-2003, 04:10 AM
I got a couple of checkboxes.

They are called:
A
B
C
D
E
etc.

I want to link them...in the beginning all of them are checked. And (for example) I uncheck A, D should uncheck too. How can I link them???

And another question I want the checkboxes to give an output to a text field so when all of them are checked there's in the textfield
A,B,C,D,E are selected..

Can someone help me with my checkbox problems
Gollum
12-03-2003, 04:22 AM
zeb,

you need to break this problem down a bit.

The first part: linking checkboxes together should probably be done on a case-by-case basis...

<form name=f>
<input type=checkbox name=A onclick="if ( !this.checked ) document.f.D.checked = false;">
<!-- and so on -->
</form>


The last part - outputting to a text field can be done like this...

var aCheckboxNames = ['A', 'B', 'C', ...];
function writeChecksToText()
{
var s = new Array;
// assuming the form name is 'f'
for ( var i = 0; i < aCheckboxNames.length; i++ )
if ( document.f[aCheckboxNames[i]].checked )
s.push(aCheckboxNames[i];

// and the textbox name is 't'
document.f.t.value = s.join();
}
Pittimann
12-03-2003, 04:51 AM
Hi!

While I was dealing with that thread, I saw, that you - Gollum - already sent the solution.

So I just want to propose a different function for the linking of the checkboxes without referring to the textbox stuff.

What about that??

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
function toggle(checkboxName1,checkboxName2) {
document.f[checkboxName2].checked = (document.f[checkboxName1].checked==true) ? true : false;
}
//-->
</script>
</head>
<body>
<form name="f" onsubmit="CheckForm()">
<input type="checkbox" name="A" onClick="toggle('A','D')" checked><br>
<input type="checkbox" name="B" checked><br>
<input type="checkbox" name="C" checked><br>
<input type="checkbox" name="D" checked><br>
<input type="checkbox" name="E" checked><br>
</form>
</body>
</html>

Adding onclick events to the other boxes like:
<input type="checkbox" name="C" onClick="toggle('C','E') checked>
and so on would complete the linking...

Cheers - Pit
zebdaag
12-03-2003, 05:47 AM
okay its beginning to work.

Your script for linking(gollums) works the best but when I check box A box D does check but when I uncheck Box A box D still is check and should uncheck.

and for the text it didn't work i got it like this:



<script language="JavaScript">
var aCheckboxNames = ['C1', 'C2', 'C3','C4'];
function writeChecksToText()
{
var s = new Array;
for ( var i = 0; i < aCheckboxNames.length; i++ )
if ( document.checkboxform[aCheckboxNames[i]].checked )
s.push(aCheckboxNames[i];

document.checkboxform.T.value = s.join();
}
</script>

can you help me further with this.?!
Pittimann
12-03-2003, 06:03 AM
Hi Zebdaag!

That's why I wrote this toggle function - whenever you click A, D will be the same (check A => D=checked, uncheck A => D=unchecked)...

Cheers - Pit
Gollum
12-03-2003, 06:10 AM
:eek:
Sorry, I missed a ) somewhere near the end of s.push(aCheckboxNames[i];
should read
s.push(aCheckboxNames[i]);
Pittimann
12-03-2003, 06:10 AM
Once more me -
forgot to mention, that I just handled things like that to avoid more code if you link another many checkboxes.

Anyway - if you prefer the way, Gollum solved it (absolutely nothing to say against it!!!) - you can do this:

<input type=checkbox name=x onclick="if ( !this.checked ) document.f.D.checked = false;else document.f.D.checked = true" checked>

Cheers - Pit
Gollum
12-03-2003, 06:25 AM
or even...

<input type=checkbox name=x onclick="document.f.D.checked = this.checked;" checked>
Pittimann
12-03-2003, 06:31 AM
;)
zebdaag
12-03-2003, 07:55 AM
linking worked thank you

now the text it didn't work... like this



<script language="javascript" >
var aCheckboxNames = ['C1', 'C2', 'C3', 'C5'];
function writeChecksToText()
{
var s = new Array;

for ( var i = 0; i < aCheckboxNames.length; i++ )
if ( document.checkboxform[aCheckboxNames[i]].checked )
s.push(aCheckboxNames[i]);

document.checkboxform.T.value = s.join();
}
</script>

what should I do now???
Pittimann
12-03-2003, 08:09 AM
Hi!

Let's use Gollum's latest version for the linking.
Then things go somehow like this:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
var aCheckboxNames = ['A', 'B', 'C', 'D', 'E'];
function writeChecksToText() {
var s = new Array;
for ( var i = 0; i < aCheckboxNames.length; i++ ) {
if ( document.f[aCheckboxNames[i]].checked )
s.push(aCheckboxNames[i]);
}
document.f.T.value = s.join();
}
//-->
</script>
</head>
<body>
<form name="f" onsubmit="CheckForm()">
<input type=checkbox name="A" onclick="document.f.D.checked = this.checked;writeChecksToText()" checked><br>
<input type="checkbox" name="B" checked onclick="writeChecksToText()"><br>
<input type="checkbox" name="C" checked onclick="writeChecksToText()"><br>
<input type="checkbox" name="D" checked onclick="writeChecksToText()"><br>
<input type="checkbox" name="E" checked onclick="writeChecksToText()"><br>
<input type="text" name="T" value="A,B,C,D,E"><br>
</form>
</body>
</html>

Cheers - Pit
zebdaag
12-05-2003, 04:47 AM
hi again,

The text input script did work fine on my pc now I'm looking it at an apple and it doesn't work. Do you have any tips how I can solve this??

<script language="JavaScript" type="text/javascript">
<!--
var aCheckboxID = ['Auto','Money','Music'];
function writeChecksToText() {
var s = new Array;
for ( var i = 0; i < aCheckboxID.length; i++ ) {
if ( document.checkboxform[aCheckboxID[i]].checked )
s.push(aCheckboxID[i]);
}
document.checkboxform.T.value = "Hoofd catagorie: " +s.join();
alert (''+s)
}
</script>

I already found out that when I uncheck all checkboxes so the output is 0 it does display in the textfield. ??
Pittimann
12-05-2003, 05:00 AM
Hi!

I assume it is because "push" to the array doesn't work.
You can try something like that:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled</title>
<script language="JavaScript" type="text/javascript">
<!--
var aCheckboxNames = ['A', 'B', 'C', 'D', 'E'];
function writeChecksToText() {
var s = new Array;
document.f.T.value=''
for ( var i = 0; i < aCheckboxNames.length; i++ ) {
if ( document.f[aCheckboxNames[i]].checked )
document.f.T.value +=aCheckboxNames[i]+',';
}
document.f.T.value = document.f.T.value.substring(0,document.f.T.value.length-1);//remove last comma
}
//-->
</script>
</head>
<body>
<form name="f" onsubmit="CheckForm()">
<input type=checkbox name="A" onclick="document.f.D.checked = this.checked;writeChecksToText()" checked><br>
<input type="checkbox" name="B" checked onclick="writeChecksToText()"><br>
<input type="checkbox" name="C" checked onclick="writeChecksToText()"><br>
<input type="checkbox" name="D" checked onclick="writeChecksToText()"><br>
<input type="checkbox" name="E" checked onclick="writeChecksToText()"><br>
<input type="text" name="T" value="A,B,C,D,E"><br>
</form>
</body>
</html>

Cheers - Pit
zebdaag
12-05-2003, 05:27 AM
i tried it this way.. but it didn't work. What did you mean by saying "remove last comma"


<script language="JavaScript" type="text/javascript">
var _aCheckboxID_=_['Auto'];
function _writeChecksToText()_{
var _s_=_new _Array;_
document.checkboxform.T.value=''
for _(_var _i_=_0;_i_<_aCheckboxID.length;_i++_)_{
if _(_document.checkboxform[aCheckboxID[i]].checked _)
document.checkboxform.T.value_+=aCheckboxID[i]+',';
}
document.checkboxform.T.value_=_document.checkboxform.T.value.substring(0,document.checkboxform.T.va lue.length-1);//remove last comma
}_
</script>
Pittimann
12-05-2003, 05:35 AM
Hi!

What did you mean by saying "remove last comma"
The version which you got to work on the PC displayed (example): A,C,D

If I add a comma to every cheboxname to be displayed it would now display: A,C,D,

Where I put this comment, I just removed this last comma bei shortening the string by its' last character - the last comma...

BTW - where do all these "_" (underscores???) in your code come from?

Cheers - Pit
zebdaag
12-05-2003, 05:38 AM
the _ came by copy pasting the script:

<script language="JavaScript" type="text/javascript">
var aCheckboxID=['Auto'];
function writeChecksToText(){
var s=new Array;
document.checkboxform.T.value=''
for (var i=0;i<aCheckboxID.length;i++){
if (document.checkboxform[aCheckboxID[i]].checked )
document.checkboxform.T.value+=aCheckboxID[i]+',';
}
document.checkboxform.T.value=document.checkboxform.T.value.substring(0,document.checkboxform.T.valu e.length-1);//remove last comma
}
</script>

it should be like this
zebdaag
12-05-2003, 05:40 AM
above this one is the good one
Pittimann
12-05-2003, 05:44 AM
Hi!

You only assign a single value to aCheckboxID:
var aCheckboxID=['Auto'];
Before we had something like:
var aCheckboxID = ['A', 'B', 'C', 'D', 'E'];

I'm sure, you didn't reduce the number of checkboxes to only one and gave it 'Auto' as its' ID or name or whatever...

Cheers - Pit
zebdaag
12-05-2003, 05:51 AM
but it shouldn't matter what ID i give it and how many ...
if i put this script in it doesn't work either.


<script language="JavaScript" type="text/javascript">
var aCheckboxName=['A','B','C','D'];
function writeChecksToText(){
var s=new Array;
document.checkboxform.T.value=''
for (var i=0;i<aCheckboxName.length;i++){
if (document.checkboxform[aCheckboxName[i]].checked )
document.checkboxform.T.value+=aCheckboxName[i]+',';
}
document.checkboxform.T.value=document.checkboxform.T.value.substring(0,document.checkboxform.T.valu e.length-1);//remove last comma
}
</script>
Pittimann
12-05-2003, 05:59 AM
var aCheckboxID=['Auto'];
=> aCheckboxID.length is 1! And only aCheckboxID[0] exists!
if one of your checkboxes is named Auto, the loop:
---------
for (var i=0;i<aCheckboxID.length;i++){
if (document.checkboxform[aCheckboxID[i]].checked )
document.checkboxform.T.value+=aCheckboxID[i]+',';
}
---------
can realize, if this single checkbox is checked. The others are ignored!! The loop just goes through that:
for (var i=0;i<1;i++){
if (document.checkboxform.Auto.checked )
document.checkboxform.T.value+='Auto'+',';
}
This is not want you want!

Cheers - Pit
zebdaag
12-05-2003, 06:11 AM
okay I try to understand what you're saying but I don't understand why the
ID 'auto' thing I had did work on the PC .



And when I put it this way :

<script language="JavaScript" type="text/javascript">
<!--
var aCheckboxID = ['A','B','C'];
function writeChecksToText() {
var s = new Array;
for ( var i = 0; i < aCheckboxID.length; i++ ) {
if ( document.checkboxform[aCheckboxID[i]].checked )
}
document.checkboxform.T.value = " Test 123" +s.join();
}
//-->
</script>


I doesn' t work either.
Pittimann
12-05-2003, 06:19 AM
Hi!

Why don't you simply use the code from my post (12:00 p.m) instead of playing around?

If your last example doesn't create an error, the best it can do, just to write " Test 123" to your textfield. There is nothing to join! I took that "push" 'n "join" stuff out to avoid this Apple error you mentioned...

Cheers - Pit