Radio buttons within objects

Question

I am creating a quiz for a website that I am developing in business catalyst. I am using javascript Object Oriented Programming to dynamically create the questions on the page.

Here is currently how the page is operating:

1) I define an object called question with several properties that are associated with answering form fields.

2) I create an array of new questions with associated properties.

3) Run a for loop function that creates the questions

4) Next the user selects radio buttons for their quiz answers

5) When the user clicks the submit button a function is run to evaluate the user's answers and measure it against the correct answer.

6) Another function runs to tally and record the user's score in the answering form.

7) A final function submits the form field to permanently record the user's answers and redirect to a pass/fail page.

I have steps 1-4 down. I am running into an issue with the user's score part in step 5. I need to run a script evaluating the user's score but in order to do that I need to get and record the value of the selected radio button. So far I have checked several different radio button evaluation scripts and they all come up with errors.

Can anyone out there help me understand how to get the selected value of the radio group? I have groups of 2 or 4 radio buttons depending on Multiple choice or true/false. Here is my code:

<script>
var quizSurvey = "{tag_quiz/survey}";
var w = window.innerWidth;
var allQuestions = 0;

function Question(questionNumber, questionText, answerType, answerA, answerB, answerC, answerD, correctAnswer, visualRef, refKey, nextQ, qTextField, aTypeField, mcAField, mcBField, mcCField, mcDField, mcUserAnswerField, tfUserAnswerField, sRatings, sSAnswer, passFail, sAnswerType) {
    this.questionNumber = questionNumber;
    this.questionText = questionText;
    this.answerType = answerType;
    this.answerA = answerA;
    this.answerB = answerB;
    this.answerC = answerC;
    this.answerD = answerD;
    this.true = "True";
    this.false = "False";
    this.correctAnswer = correctAnswer;
    this.visualRef = visualRef;
    this.refKey = refKey;
    this.nextQ = nextQ;
    this.qTextField = qTextField;
    this.aTypeField = aTypeField;
    this.mcAField = mcAField;
    this.mcBField = mcBField;
    this.mcCField = mcCField;
    this.mcDField = mcDField;
    this.mcUserAnswerField = mcUserAnswerField;
    this.tfUserAnswerField = tfUserAnswerField;
    this.sRatings = sRatings;
    this.sSAnswer = sSAnswer;
    this.passFail = passFail;
    this.sAnswerType = sAnswerType;
    this.answer = "";
    this.vimeo = "";
    this.youtube = "";
    this.img = "";
    this.layoutVimeo = "";
    this.visual = "";
    this.visRefType = function() {
        if (this.visualRef != "") {
            if (this.visualRef === "Vimeo Video" && this.refKey !== "") {
                this.vimeo = '<div class="vimeo-container_' + quizSurvey + '"><iframe src="//player.vimeo.com/video/' + this.refKey + '" width="100%" height="auto" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe></div>';
                this.visual = this.vimeo;
                this.layoutVimeo = "vimeo";
            } else if (this.visualRef === "Youtube Video" && this.refKey !== "") {
                this.youtube = '<div class="youtube-container_' + quizSurvey + '"><iframe width="100%" height="auto" src="//www.youtube.com/embed/' + this.refKey + '" frameborder="0" allowfullscreen></iframe></div>';
                this.visual = this.youtube;
            } else if (this.visualRef === "Image" && this.refKey !== "") {
                this.img = '<div class="img-container_' + quizSurvey + '"><a href="' + this.refKey + '"><img src="' + this.refKey + '"></a></div>';
                this.visual = this.img;
            } else {

            };
        };
    };
    this.createQuestion = function() {
        document.write('<div class="question' + questionNumber + '" id="question' + questionNumber + '_{tag_itemid}"><div class="row" style="margin:0rem 0rem 1rem 0rem;"><div class="small-2 large-1 columns question_number"><h6>' + this.questionNumber + '</h6></div><div class="small-10 large-11 columns question_text" style="margin:0rem 1rem 0rem 0rem;"><p>' + this.questionText + '</p></div></div>');
        if (this.answerType === "Multiple Choice") {
            document.write('<div class="row" style="margin:0rem 0rem 2rem 0rem;"><div class="small-12 medium-6 medium-push-6 columns">' + this.visual + '</div><div class="small-12 medium-6 medium-pull-6 columns"><div class="row" style="margin:0rem 0rem .5rem 0rem;"><div class="small-2 medium-3 large-2 columns"><div class="multichoice-answer"><input type="radio" name="' + this.mcUserAnswerField + '" id="' + this.mcUserAnswerField + '_0" value="A" />&nbsp;&nbsp;<strong>A</strong></div></div><div class="small-10 medium-9 large-10 columns"><p style="margin:.9rem 0rem 0rem 1rem;">' + this.answerA + '</p></div></div><div class="row" style="margin:0rem 0rem .5rem 0rem;"><div class="small-2 medium-3 large-2 columns"><div class="multichoice-answer"><input type="radio" name="' + this.mcUserAnswerField + '" id="' + this.mcUserAnswerField + '_1" value="B" />&nbsp;&nbsp;<strong>B</strong></div></div><div class="small-10 medium-9 large-10 columns"><p style="margin:.9rem 0rem 0rem 1rem;">' + this.answerB + '</p></div></div><div class="row" style="margin:0rem 0rem .5rem 0rem;"><div class="small-2 medium-3 large-2 columns"><div class="multichoice-answer"><input type="radio" name="' + this.mcUserAnswerField + '" id="' + this.mcUserAnswerField + '_2" value="C" />&nbsp;&nbsp;<strong>C</strong></div></div><div class="small-10 medium-9 large-10 columns"><p style="margin:.9rem 0rem 0rem 1rem;">' + this.answerC + '</p></div></div><div class="row" style="margin:0rem 0rem .5rem 0rem;"><div class="small-2 medium-3 large-2 columns"><div class="multichoice-answer"><input type="radio" name="' + this.mcUserAnswerField + '" id="' + this.mcDFieldField + '_3" value="D" />&nbsp;&nbsp;<strong>D</strong></div></div><div class="small-10 medium-9 large-10 columns"><p style="margin:.9rem 0rem 0rem 1rem;">' + this.answerD + '</p></div></div></div></div></div>');
        } else if (this.answerType == "True/False") {
            document.write('<div class="row" style="margin:0rem 0rem 2rem 0rem;"><div class="small-12 medium-6 medium-push-6 columns">' + this.visual + '</div><div class="small-12 medium-6 medium-pull-6 columns"><div class="quiz-tf"><input type="radio" name="' + this.tfUserAnswerField + '" id="' + this.tfUserAnswerField + '_0" value="True" />&nbsp;&nbsp;<strong>True</strong></div><div class="quiz-tf"><input type="radio" name="' + this.tfUserAnswerField + '" id="' + this.tfUserAnswerField + '_1" value="False" />&nbsp;&nbsp;<strong>False</strong></div></div></div></div>');
        };
    };
    this.surveyQuestion = function() {
        document.write('<div class="question' + questionNumber + '" id="question' + questionNumber + '_{tag_itemid}"><div class="row" style="margin:0rem 0rem 1rem 0rem;"><div class="small-2 large-1 columns question_number"><h6>' + this.questionNumber + '</h6></div><div class="small-10 large-11 columns question_text" style="margin:0rem 1rem 0rem 0rem;"><p>' + this.questionText + '</p></div></div>');
        if (this.sAnswerType === "Ratings (1-10)") {
            if (w <= 900) {
                document.write('<div class="row" style="margin:0rem 0rem 2rem 0rem;"><div class="small-12 columns"><div class="' + this.layoutVimeo + '-adjust">' + this.visual + '</div></div><div class="small-12 medium-12 columns"><div class="ratings-answer" id="ratings-' + this.questionNumber + '"><br /><select name="' + this.sRatings + '" id="' + this.sRatings + '" class="cat_dropdown"><option value=" ">-- Please select a rating --</option><option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option></select><p class="smallnote" style="margin:-.65rem 0rem 0rem 0rem;"> Please rate accordingly (1 = low, 10 = high)</p></div></div></div></div>');
            } else {
                document.write('<div class="row" style="margin:0rem 0rem 2rem 0rem;"><div class="small-9 medium-12 columns"><div class="' + this.layoutVimeo + '-adjust">' + this.visual + '</div><div class="small-3 medium-12 columns"><div class="ratings-answer" id="ratings-' + this.questionNumber + '"><input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_0" value="1" />&nbsp;1&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_1" value="2" />&nbsp;2&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_2" value="3" />&nbsp;3&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_3" value="4" />&nbsp;4&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_4" value="5" />&nbsp;5&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_5" value="6" />&nbsp;6&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_6" value="7" />&nbsp;7&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_7" value="8" />&nbsp;8&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_8" value="9" />&nbsp;9&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;<input type="radio" name="' + this.sRatings + '" id="' + this.sRatings + '_9" value="10" />&nbsp;10<br /><p class="smallnote">(Please rate accordingly 1=low, 10=high)</p></div></div></div></div></div>');
            };
        } else {
            document.write('<div class="row" style="margin:0rem 0rem 2rem 0rem;"><div class="small-12 medium-6 medium-push-6 columns">' + this.visual + '</div><div class="small-12 medium-6 medium-pull-6 columns"><div class="short-answer-textbox"><textarea name="' + this.sSAnswer + '" id="' + this.sSAnswer + '" cols="10" rows="4" class="cat_listbox"onkeydown="if(this.value.length>=4000)this.value=this.value.substring(0,3999);"></textarea></div></div></div></div>');
        };
    };
    this.getRadioVal = function() {
        this.val = "0";
        if (this.answerType == "Multiple Choice") {
            this.radios = document.getElementByName(this.mcUserAnswerField);

        for (var i = 0, len = this.radios.length; i < len; i++) {
            if (this.radios[i].checked == true) {
                this.val = this.radios[i].value;
                break;
            }
        };
        } else {
            alert ("Not Multiple Choice!");
        };
        alert(val);
    };
};
var question = new Array();

question[0] = new Question(1, "{tag_q-question_1}", "{tag_q-answer-type_1}", "{tag_q-text-answer_101}", "{tag_q-text-answer_102}", "{tag_q-text-answer_103}", "{tag_q-text-answer_104}", "{tag_q-multichoice-answer_1}{tag_q-t/f-answer_1}", "{tag_q-visual-reference_1}", "{tag_q-youtube_1}{tag_q-vimeo_1}{tag_q-image_1_value}", "{tag_q-next-question_1}", "CAT_Custom_13", "CAT_Custom_11", "CAT_Custom_14", "CAT_Custom_15", "CAT_Custom_16", "CAT_Custom_17", "CAT_Custom_7", "CAT_Custom_8", "CAT_Custom_9", "CAT_Custom_10", "CAT_Custom_12", "{tag_s-answer-type_1}");
question[1] = new Question(2, "{tag_q-question_2}", "{tag_q-answer-type_2}", "{tag_q-text-answer_201}", "{tag_q-text-answer_202}", "{tag_q-text-answer_203}", "{tag_q-text-answer_204}", "{tag_q-multichoice-answer_2}{tag_q-t/f-answer_2}", "{tag_q-visual-reference_2}", "{tag_q-youtube_2}{tag_q-vimeo_2}{tag_q-image_2_value}", "{tag_q-next-question_2}", "CAT_Custom_19", "CAT_Custom_20", "CAT_Custom_22", "CAT_Custom_23", "CAT_Custom_24", "CAT_Custom_25", "CAT_Custom_21", "CAT_Custom_26", "CAT_Custom_27", "CAT_Custom_28", "CAT_Custom_29", "{tag_s-answer-type_2}");
question[2] = new Question(3, "{tag_q-question_3}", "{tag_q-answer-type_3}", "{tag_q-text-answer_301}", "{tag_q-text-answer_302}", "{tag_q-text-answer_303}", "{tag_q-text-answer_304}", "{tag_q-multichoice-answer_3}{tag_q-t/f-answer_3}", "{tag_q-visual-reference_3}", "{tag_q-youtube_3}{tag_q-vimeo_3}{tag_q-image_3_value}", "{tag_q-next-question_3}", "CAT_Custom_30", "CAT_Custom_31", "CAT_Custom_33", "CAT_Custom_34", "CAT_Custom_35", "CAT_Custom_36", "CAT_Custom_32", "CAT_Custom_37", "CAT_Custom_38", "CAT_Custom_39", "CAT_Custom_40", "{tag_s-answer-type_3}");
question[3] = new Question(4, "{tag_q-question_4}", "{tag_q-answer-type_4}", "{tag_q-text-answer_401}", "{tag_q-text-answer_402}", "{tag_q-text-answer_403}", "{tag_q-text-answer_404}", "{tag_q-multichoice-answer_4}{tag_q-t/f-answer_4}", "{tag_q-visual-reference_4}", "{tag_q-youtube_4}{tag_q-vimeo_4}{tag_q-image_4_value}", "{tag_q-next-question_4}", "CAT_Custom_41", "CAT_Custom_42", "CAT_Custom_44", "CAT_Custom_45", "CAT_Custom_46", "CAT_Custom_47", "CAT_Custom_43", "CAT_Custom_48", "CAT_Custom_49", "CAT_Custom_50", "CAT_Custom_51", "{tag_s-answer-type_4}");

var userScore = 0;
var scorePercentage = 0;

if (quizSurvey == "Quiz") {
    for (var i = 0; i <= 14; i++) {
        if (question[i].questionText != "") {
            question[i].visRefType();
            question[i].createQuestion();
        } else {

        };
        allQuetions = allQuestions + 1;
    };
};

if (quizSurvey == "Survey") {
    for (var i = 0; i <= 14; i++) {
        if (question[i].questionText != "") {
            question[i].visRefType();
            question[i].surveyQuestion();
        } else {

        };
        allQuestions = allQuestions + 1;
    };
};

var passingScore = {tag_required score to pass};

    var evalScore = function() {
    scorePercentage = userScore / allquestions * 100;
    if (scorePercentage >= passingScore) {
    document.getElementById(CAT_Custom_5).checked = true;
    document.getElementById(CAT_Custom_18).value = scorePercentage;
    alert("You pass!");
} else {
    alert("You did not pass.")

};
};

    var TEST = function() {
    if (quizSurvey == "Quiz") {
    for (var i = 0; i <= allQuestions; i++) {
    question[i].getRadioVal();        
};
} else {
    alert("Not a Quiz!");
};
};

The questions are generated - after everything is answered and there will be a submit button. In the mean time I have a test button to run the function.

EDIT: Here is the most relevant code:

this.getRadioVal = function() {
        this.val = "0";
        if (this.answerType == "Multiple Choice") {
            this.radios = document.getElementByName(this.mcUserAnswerField);

        for (var i = 0, len = this.radios.length; i < len; i++) {
            if (this.radios[i].checked == true) {
                this.val = this.radios[i].value;
                break;
            }
        };
        } else {
            alert ("Not Multiple Choice!");
        };
        alert(val);
    };
};