Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations strongm on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

tick box depending on other form value

Status
Not open for further replies.

dkemas

Programmer
Mar 22, 2012
70
GB
I have a form that features 10 questions.

It goes like this

Do you agree with statement 1? Answer 1-3 (1 fully agree, 2 not sure, 3 disagree)
Do you agree with statement 2? Answer 1-3 (1 fully agree, 2 not sure, 3 disagree)
etc etc for all 10 questions

If 2 is selected it needs to automatically tick another checkbox on that row.
If 3 is selected it needs to automatically tick a different checkbox on that row.

The page already contains a jquery element so I can use either jquery or javascript to achieve this. I tried googling but couldn't find anything, maybe because it is hard to find the right terms to search for.

Thanks for any help
 
Use the on click event of the elements that control the states of the other two to run a function that checks them.

Assuming checkboxes:

Code:
function checkRqBox(chkObj,secondbox){
If(chkObj.ckecked){
document.getElementById(secondbox).checked=true;

}

.
.
.


<input type="checkbox" onclick="chkRqBox(this,'requiredchkboxID');"...>

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
I've now build the html for this page, hope this helps to explain what I am trying to do further. There are 10

Code:
<tr>
				<td>Q1</td>
				<td>The question goes here</td>
				<td><select name='q1score'><option value=''>- Please select -</option><option value='3'>3</option><option value='2'>2</option><option value='1'>1</option></select></td>
								<td><input type='checkbox' name='q1flag' /></td>
				<td><input type='checkbox' name='q1redflag' /></td>
			</tr>

There are 10 questions, q1 to q10 each on their own row.

If they select a '2' on the score dropdown, the q1flag checkbox needs to tick automatically, if they select '3' on the score dropdown, the redflag checkbox ticks automatically. I need this to work for all 10 questions.

Does that make sense?
 
Hi

Can not say that it makes sense to me, so just a try :
JavaScript:
[b]function[/b] [COLOR=darkgoldenrod]tick[/color][teal]([/teal]what[teal])[/teal]
[teal]{[/teal]
  what[teal].[/teal]form[teal][[/teal]what[teal].[/teal]name[teal].[/teal][COLOR=darkgoldenrod]slice[/color][teal]([/teal][purple]0[/purple][teal],-[/teal][purple]5[/purple][teal])+[/teal][green][i]'flag'[/i][/green][teal]].[/teal]checked[teal]=[/teal]what[teal].[/teal]value[teal]==[/teal][green][i]'2'[/i][/green]
  what[teal].[/teal]form[teal][[/teal]what[teal].[/teal]name[teal].[/teal][COLOR=darkgoldenrod]slice[/color][teal]([/teal][purple]0[/purple][teal],-[/teal][purple]5[/purple][teal])+[/teal][green][i]'redflag'[/i][/green][teal]].[/teal]checked[teal]=[/teal]what[teal].[/teal]value[teal]==[/teal][green][i]'3'[/i][/green]
[teal]}[/teal]
Code:
[b]<select[/b] [maroon]name[/maroon][teal]=[/teal][green][i]'q1score'[/i][/green] [highlight][maroon]onclick[/maroon][teal]=[/teal][green][i]"tick(this)"[/i][/green][/highlight][b]>[/b]
[b]<option[/b] [maroon]value[/maroon][teal]=[/teal][green][i]''[/i][/green][b]>[/b]- Please select -[b]</option>[/b]
[b]<option[/b] [maroon]value[/maroon][teal]=[/teal][green][i]'3'[/i][/green][b]>[/b]3[b]</option>[/b]
[b]<option[/b] [maroon]value[/maroon][teal]=[/teal][green][i]'2'[/i][/green][b]>[/b]2[b]</option>[/b]
[b]<option[/b] [maroon]value[/maroon][teal]=[/teal][green][i]'1'[/i][/green][b]>[/b]1[b]</option>[/b]
[b]</select>[/b]


Feherke.
 
I'd use the onChange event of the dropdown in that case. Other than getting the question number which there are many ways to do, the conditional logic is pretty much the same. check the value, and tick the appropriate box.

Code:
[b][COLOR=#0000FF ]function[/color][/b] [b][COLOR=#000000 ]checkRqBox[/color][/b][COLOR=#990000 ]([/color]selObj[COLOR=#990000 ])[/color]
[COLOR=#FF0000 ]{[/color]
 [i][COLOR=#9A1900 ]//Get Question number from dropdown name[/color][/i]
 [b][COLOR=#0000FF ]var[/color][/b] Qno[COLOR=#990000 ]=[/color]drpObj[COLOR=#990000 ].[/color]name[COLOR=#990000 ].[/color][b][COLOR=#000000 ]charAt[/color][/b][COLOR=#990000 ]([/color][COLOR=#993399 ]1[/color][COLOR=#990000 ]);[/color]
 [b][COLOR=#0000FF ]var[/color][/b] chkBox[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]""[/color][COLOR=#990000 ];[/color]
 [i][COLOR=#9A1900 ]//check for value selected and construct the name of the flag to be checked using the question number, and the flag or red flag string..[/color][/i]
 [b][COLOR=#0000FF ]if[/color][/b][COLOR=#990000 ]([/color]drpObj[COLOR=#990000 ].[/color]value[COLOR=#990000 ]==[/color][COLOR=#993399 ]2[/color][COLOR=#990000 ])[/color][COLOR=#FF0000 ]{[/color]
  chkBox[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]"q"[/color] [COLOR=#990000 ]+[/color] Qno [COLOR=#990000 ]+[/color] [COLOR=#FF0000 ]"flag"[/color][COLOR=#990000 ];[/color]
 [COLOR=#FF0000 ]}[/color]
 [b][COLOR=#0000FF ]if[/color][/b][COLOR=#990000 ]([/color]drpObj[COLOR=#990000 ].[/color]value[COLOR=#990000 ]==[/color][COLOR=#993399 ]3[/color][COLOR=#990000 ])[/color][COLOR=#FF0000 ]{[/color]
  chkBox[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]"q"[/color] [COLOR=#990000 ]+[/color] Qno [COLOR=#990000 ]+[/color] [COLOR=#FF0000 ]"redflag"[/color][COLOR=#990000 ];[/color]
 [COLOR=#FF0000 ]}[/color]
 [i][COLOR=#9A1900 ]//check that the flag name is not empty meaning one of the target values was selected.[/color][/i]
 [b][COLOR=#0000FF ]if[/color][/b][COLOR=#990000 ]([/color]chkBox[COLOR=#990000 ]!=[/color][COLOR=#FF0000 ]""[/color][COLOR=#990000 ])[/color][COLOR=#FF0000 ]{[/color]
  [i][COLOR=#9A1900 ]//tick the correct checkbox using the created name.[/color][/i]
  document[COLOR=#990000 ].[/color]formName[COLOR=#990000 ].[/color]elements[COLOR=#990000 ][[/color]chkBox[COLOR=#990000 ]].[/color]checked[COLOR=#990000 ]=[/color][b][COLOR=#0000FF ]true[/color][/b][COLOR=#990000 ];[/color]
  [b][COLOR=#0000FF ]return[/color][/b] [b][COLOR=#0000FF ]true[/color][/b][COLOR=#990000 ];[/color]
 [COLOR=#FF0000 ]}[/color]
  [b][COLOR=#0000FF ]return[/color][/b] [b][COLOR=#0000FF ]false[/color][/b][COLOR=#990000 ];[/color]

[COLOR=#FF0000 ]}[/color]



[COLOR=#990000 ].[/color]
[COLOR=#990000 ].[/color]
[COLOR=#990000 ].[/color]


[COLOR=#990000 ]<[/color]select name[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]"q1score"[/color] onchange[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]"chkRqBox(this);"[/color][COLOR=#990000 ]...>[/color]
[COLOR=#990000 ]...[/color]
[COLOR=#990000 ]</[/color]select[COLOR=#990000 ]>[/color]
[COLOR=#990000 ]<[/color]input type[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]"checkbox"[/color] name[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]"q1flag"[/color][COLOR=#990000 ]>[/color]
[COLOR=#990000 ]<[/color]input type[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]"checkbox"[/color] name[COLOR=#990000 ]=[/color][COLOR=#FF0000 ]"q1redflag"[/color][COLOR=#990000 ]>[/color]

With that said, not sure what the purpose of self ticking checkboxes is, if you already have the value that determines this.

Also if both boxes cannot be ticked at the same time, and to avoid extra coding, I'd use radio buttons instead.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Hi

dkemas said:
There are 10 questions, q1 to q10 each on their own row.
Phil said:
Code:
 [b][COLOR=#0000FF]var[/color][/b] Qno[COLOR=#990000]=[/color]drpObj[COLOR=#990000].[/color]name[COLOR=#990000].[/color][b][COLOR=#000000]charAt[/color][/b][COLOR=#990000]([/color][COLOR=#993399]1[/color][COLOR=#990000]);[/color]
Just one thing : extracting a single character is not enough.

Feherke.
 
True, missed that. If the Qno is 1 you'll need to extract an extra character to see if its really q1 or q10.

Should not be to hard to do based on what's already there though.

----------------------------------
Phil AKA Vacunita
----------------------------------
Ignorance is not necessarily Bliss, case in point:
Unknown has caused an Unknown Error on Unknown and must be shutdown to prevent damage to Unknown.

Web & Tech
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top