Hi,
Trying to use the validation plugin (http://docs.jquery.com/Plugins/
Validation) to manage the following:
<input type="radio" name="q8b" id="q8b_1" value="1" />
<input type="radio" name="q8b" id="q8b_2" value="2" />
<input type="radio" name="q8b" id="q8b_3" value="3" />
<input type="text" name="q8c" id="q8c" value="" maxlength="200"
size="30" />
Either a radio button must be checked, or something must be in the
text box.
If no radio button is checked and nothing is typed in the text box, I
need an error message.
If a radio button is checked AND something is typed, I need an error
message.
In addition, I want only one error message - if no radio button is
checked and nothing is typed in the text box, I don't want an error
message next to each.
I've almost got something working but I cannot for the life of me get
it to produce an error message on the "too much information" condition
- a radio button checked and something typed in the text box. Here's
what I've got. I appreciate that it's hideous code so any attempt to
improve it past making it work would be massively appreciated.
$(document).ready(function() {
$('#fQuestionnaire2').validate({
groups: {
q8: "q8b q8c"
},
rules: {
q8b:{
required : function(element) {
var rv = false;
var questionvisible =
($('input[name=q8a]:checked').val() == 2) ?
true : false;
var somethingChecked =
($('input[name=q8b]:checked').length >
0) ? true : false;
var somethingEntered = ($("#q8c").val()
!= '') ? true : false;
var tooMuchInfo = (questionvisible &&
somethingChecked &&
somethingEntered) ? true : false;
var notEnoughInfo = (questionvisible &&
!somethingChecked && !
somethingEntered) ? true : false;
if (tooMuchInfo){rv = true}
if (notEnoughInfo){rv = true}
return rv;
}
},
q8c:{
required : function(element) {
/* exactly the same code as for q8b
above - cut from post for
ease of reading/*
}
messages: {
q8b:{required: "Please select a reason or enter one of
your own."},
q8c:{required: "Please select a reason or enter one of
your own."}
}
});
});
