using the not applicable feature on multiple questions

Question

I wish to use the "Not applicable" question feature on both gender and age questions.

So it will look something like this on the same page …

Age: Numeric
Gender: Select (Male / Female)
Checkbox: Don't know

When the Don't know check box is selected, the age and gender are cleared?

I would also like the text high-lighting of the check box to only high-light the "Don't know" label slightly after the label, rather than the entire survey page.

Thank you.

Answer 1

Replace the function updateNotApplicableQuestion with this specialized version:

function updateNotApplicableQuestion(baseQuestion, naQuestion, name, bln) {
    $('#[% QuestionName() %]_1').closest('.clickable').css('display', 'inline-block').css('width', 'auto');
    var ageQuestion = $('.question.numeric').attr('id').replace(/_div/, '');
    var sexQuestion = $('.question.select').attr('id').replace(/_div/, '');
    if (bln) {
        $('#' + ageQuestion).val('');
        $('#' + ageQuestion).prop('disabled', true);
        SSI_RadioReset(sexQuestion);
        SSI_DisableGraphicalInput(sexQuestion + '_1');
        SSI_DisableGraphicalInput(sexQuestion + '_2');
    }
    else {
        $('#' + ageQuestion).prop('disabled', false);
        SSI_EnableGraphicalInput(sexQuestion + '_1');
        SSI_EnableGraphicalInput(sexQuestion + '_2');
    }
}

Then replace the verification with this:

var ageQuestionDiv = $('.question.numeric');
var ageQuestion = $(ageQuestionDiv).attr('id').replace(/_div/, '');
var sexQuestionDiv = $('.question.select');
var sexQuestion = $(sexQuestionDiv).attr('id').replace(/_div/, '');

var age = $('#' + ageQuestion).val();
var sex = SSI_GetValue(sexQuestion);
var notApplicable = SSI_GetValue('[% QuestionName() %]_1');

$(ageQuestionDiv).removeClass('error_quest_highlight2');
$('#' + ageQuestion + '_err2').remove();
if (age === '' && !notApplicable) {
    strErrorMessage = 'Question must be answered or "Not Applicable" must be selected.';

    $(ageQuestionDiv).removeClass('error_quest_highlight');
    $('#' + ageQuestion + '_err').remove();
    $(ageQuestionDiv).addClass('error_quest_highlight2');
    $(ageQuestionDiv).prepend('<div id="' + ageQuestion + '_err2" class="question_error_box error_messages"></div>');
    $('#' + ageQuestion + '_err2').append('<div class="question_errors">' + strErrorMessage + '</div>');
}

$(sexQuestionDiv).removeClass('error_quest_highlight2');
$('#' + sexQuestion + '_err2').remove();
if (sex == 0 && !notApplicable) {
    strErrorMessage = 'Question must be answered or "Not Applicable" must be selected.';

    $(sexQuestionDiv).removeClass('error_quest_highlight');
    $('#' + sexQuestion + '_err').remove();
    $(sexQuestionDiv).addClass('error_quest_highlight2');
    $(sexQuestionDiv).prepend('<div id="' + sexQuestion + '_err2" class="question_error_box error_messages"></div>');
    $('#' + sexQuestion + '_err2').append('<div class="question_errors">' + strErrorMessage + '</div>');
}

"DisableGraphicalInputs" from the Community Question Library is still required, of course.

Comments

Oh, I see.  That does invalidate some of the assumptions I had made in my modifications.  Here are a few more changes:

* Replace lines 3-5 of the modified function with this:

var ageQuestion = $('#[% QuestionName() %]_div').prevAll('.question.numeric').eq(0).attr('id').replace(/_div/, '');
var sexQuestion = $('#[% QuestionName() %]_div').prevAll('.question.select').eq(0).attr('id').replace(/_div/, '');
if (SSI_GetValue('[% QuestionName() %]_1')) {

* Similarly, replace lines 1 and 3 of the verification with these two lines:

var ageQuestionDiv = $('#[% QuestionName() %]_div').prevAll('.question.numeric').eq(0);
var sexQuestionDiv = $('#[% QuestionName() %]_div').prevAll('.question.select').eq(0);

* The final change doesn't meet the usual standards I try to hold myself to with the community question library, but shouldn't hurt for a one time change you need.  When you copy-and-paste the Not Applicable question to create a second one, they will both have a few references to the function "updateNotApplicableQuestion" in their footers.  This needs to be changed in such a way that each question is using a unique function name.

---

Thanks for the latest info Zachary.

I'm still having troubles getting it working? Apologies.

I changed lines 3-4-5 of both checkbox questions.

I also changed removed lines 1+3 in the verifications and replaced them with your 2 new lines of script.

I just sent through the ssi hoping that makes more sense of where I slipped up?

---

And I was a bit confused by your final comment regarding the final change?

---

In the second Not Applicable question's footer, replace every "updateNotApplicableQuestion" with "updateNotApplicableQuestion2".  This will keep the second question from writing over the first question's function.

---

Zachary, that got it working a treat. Very grateful for your timely assistance. Onya mate.