Re-enabling disabled boxes and conditional form validation 1

[castus]

05-21-05 - 08:48 PM
I'm struggling to find a solution to my JS problem as I'm not really up to s
peed with JS.

I want to disable a bunch of checkboxes (monday - friday) if a anytime box i
s checked and re-enable them again if the anytime box is unchecked. So far I
have managed to disable them, but they stay disabled until I reload the pag
e.

This is the action attached to the anytime checkbox that disables monday - f
riday. Each day has 4 checkboxes of its own.

input name="anytime" type="checkbox" id="anytime" value="Yes"

onclick="
this.form.elements['Monday'][0].disabled = true;
this.form.elements['Monday'][1].disabled = true;
this.form.elements['Monday'][2].disabled = true;
this.form.elements['Monday'][3].disabled = true;
this.form.elements['Tuesday'][0].disabled = true;
this.form.elements['Tuesday'][1].disabled = true;
this.form.elements['Tuesday'][2].disabled = true;
this.form.elements['Tuesday'][3].disabled = true;
this.form.elements['Wednesday'][0].disabled = true;
this.form.elements['Wednesday'][1].disabled = true;
this.form.elements['Wednesday'][2].disabled = true;
this.form.elements['Wednesday'][3].disabled = true;
this.form.elements['Thursday'][0].disabled = true;
this.form.elements['Thursday'][1].disabled = true;
this.form.elements['Thursday'][2].disabled = true;
this.form.elements['Thursday'][3].disabled = true;
this.form.elements['Friday'][0].disabled = true;
this.form.elements['Friday'][1].disabled = true;
this.form.elements['Friday'][2].disabled = true;
this.form.elements['Friday'][3].disabled = true;"/>

As you can see it doesn't check anything - just disables all the boxes menti
oned.

PROBLEM 2

I have 3 text boxes - email, phone, mobile and preferred method of response
checkboxes. So if the user checks the box for wanting to emailed back they m
ust have entered an email address or if they wanting phoning they must have
entered a phone number etc and they cannot submit the form until they have d
one so.

I don't really have a problem validating forms it's just how to compare the
boxes if the other is checked.


input name="email" type="text" class="form_blocks" id="email" size="25" max
length="30" />
input name="phone" type="text" class="form_blocks" id="phone" size="25" max
length="30" />
input name="mobile" type="text" class="form_blocks" id="mobile" size="25" ma
xlength="30" />

input name="preferred" type="checkbox" value="Phone" />
input name="preferred" type="checkbox" value="Mobile" />
input name="preferred" type="checkbox" value="Email" />

Any help on the above would really be appreciated.

:-/

 

[BillyRayPreachersSon]

With regards to your initial problem, if you change your checkbox to be:

<input name="anytime" type="checkbox" id="anytime" value="Yes" onclick="toggleDays(this.checked);" />

and then add this function to your script section:

function toggleDays(checkedValue) {
	var frm = document.forms['yourFormName'].elements;
	for (var loop=0; loop<4; loop++) {
		frm['Monday'][loop].disabled = checkedValue;
		frm['Tuesday'][loop].disabled = checkedValue;
		frm['Wednesday'][loop].disabled = checkedValue;
		frm['Thursday'][loop].disabled = checkedValue;
		frm['Friday'][loop].disabled = checkedValue;
	}
}

then you should be able to enable / disable the weekday boxes OK.

Obviously you will have to change "yourFormName" to be the real name of your form.

Hope this helps,
Dan

[tt]D'ya think I got where I am today because I dress like Peter Pan here?[/tt]

 

[castus]

Thanks very much - works a treat!

[loop] - I thought there must be an easier way of going through all four options rather then doing each individually.