Take the 2-minute tour ×
Stack Overflow is a question and answer site for professional and enthusiast programmers. It's 100% free, no registration required.

I have a form created at run time using angularjs. This form has 6 questions and where question 1 answers are radio buttons while rest of questions have checkbox answers.

form is created as

<form ng-controller="PersonalityCtrl" ng-submit="submitInterests()">

    <div ng-repeat="question in interestQuestions.slice(0,1)" style="display: block;">
        <br> <span style="float: left">{{question.question}}</span> <br />
        <span ng-repeat="(key, value) in question.choices"> 
            <input  name="{{question.number}}"
            ng-click="addChoice(question.number, key,question.questionType)"
            type="radio" value="{{key}}" required />
            {{value}}
        </span> <br />
    </div>

    <div ng-repeat="question in interestQuestions.slice(1,6)" style="display: block;">
        <br> <span style="float: left">{{question.question}}</span> <br />
        <span ng-repeat="(key, value) in question.choices"> 
            <input  name="{{question.number}}"
            ng-click="addChoice(question.number, key,question.questionType)"
            type="checkbox" value="{{key}}" />
            {{value}}
        </span> <br />
    </div>
    <input type="submit" value="submit"></input>
    </ng-form>

My generated form looks like

Question : 1
0 0 0 0 0 (0 represents radio button)

Question : 2 
o o o o o (o represents check box)

Question : 3
o o o o o (o represents check box)

Question : 4
o o o o o (o represents check box)

and when i submit the form my post data should be of the form

[{1:[list of answers]},{2:[list of answers]},{...},{...},{...},{...}]

where 1,2 represents question number, while list of answers are value of checkboxes.

My question is how can i save answer for each question in separate array using angularjs.

Currently i am doing it as (but it does not seems angular way).

var q1 = {
        questionNumber : 1,
        answer : new Array()
    };
    var q2 = {
        questionNumber : 2,
        answer : new Array()
    };
    var q3 = {
        questionNumber : 3,
        answer : new Array()
    };
    var q4 = {
        questionNumber : 4,
        answer : new Array()
    };
    var q5 = {
        questionNumber : 5,
        answer : new Array()
    };
    var q6 = {
        questionNumber : 6,
        answer : new Array()
    };

    var userInterestAnswers = [ q1, q2, q3, q4, q5, q6 ];
    var choiceList = new Array();

    $scope.addChoice = function(question, choice, questionType) {

        switch (question) {
        case 1:
            q1.answer.push(choice);
            break;
        case 2:
            q2.answer.push(choice);
            break;
        case 3:
            q3.answer.push(choice);
            break;

        case 4:
            q4.answer.push(choice);
            break;

        case 5:
            q5.answer.push(choice);
            break;

        case 6:
            q6.answer.push(choice);
            break;

        default:

        }
share|improve this question
add comment

1 Answer

How about rewrite the addChoice function like this

$scope.addChoice = function (question, choice, questionType) {
    userInterestAnswers[question].answer.push(choice);
}

And if you can add a type field in the foreach question, you can use ng-switch to display either checkboxes or radio buttons so you can merge the 2 repeaters. Try to rewrite to this pattern

<div ng-repeat ... >
    <div ng-switch on "question.type">
        <input ng-switch-when="multichoice" type="checkbox" ... >
        <input ng-switch-when="singlechoice" type="radio" ... >
    </div>
</div>
share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.