vendredi 9 octobre 2015

posting iterated data in one request with angularjs

i am currently developing a simple examination application using angular as my frontend and i have encountered this problem which is bugging me for two days till now, my problem is how to make a request(POST) in which your data to be post is comming from a iterated data (in my case, is question.id and tempanswer (ng-repeat directive)) in my view, i know how to post single request but not on this-- ^_^.

take a look on my snnipet code..

Backend.

public function submitExam() {

    $student_id = $this->request->student_id;
    $subject = Subject::find($this->request->subject_id);

    //$question_count = Question::where('subject_slug', $subject->slug)->count();

    $tempAnswers = json_decode($this->request->answers);
    //dd($this->request->answers);
    foreach ($tempAnswers as $tempQuestionKey => $tempAnswer) {

        Tempanswer::insert([
            'question_id' => $tempQuestionKey,
            'temp_answer' => $tempAnswer,
            'student_id'  => $student_id,
            'subject_id'  => $subject->id
            ]);

        Examinationresult::insert([
            'question_id' => $tempQuestionKey,
            'subject_id'  => $subject->id,
            'student_id'  => $student_id
            ]);
    }

Angular(frontend).

$scope.mobileSubmitExam = function() {
        var result = $window.confirm('Are you sure to submit?');
        //var tempAnswer = {$scope.examDetail[0].id: $scope.answers};
        var submitInfo = {
            'answers': $scope.answers;
            'student_id': $scope.studentDetail.id,
            'subject_slug': $scope.subject_slug,
            'subject_id': subject_id
        };

        if(result == true) {

            $http.post(BASE_URL + 'mobile/examination/submit', submitInfo)
                .success(function(response) {
                    console.log(response);
                })
                .error(function() {
                    $window.confirm('Error on submitting the examination!');
                })
        }
    };

View(Html).

<div ng-show="!examKey" class="row">
    <div class="col s12">
        <div class="card card grey darken-3">
            <div class="card-content white-text">
                <div>
                    <header>
                        <small>
                            <strong>
                                <p>Student: <span class="white-text">@{{studentDetail.firstname}}&nbsp;&nbsp;@{{studentDetail.middlename[0]}}.&nbsp;&nbsp;@{{studentDetail.lastname}}</span></p>
                                <p>Subject: <span class="white-text">@{{subject_slug}}</span></p>
                                <hr>
                            </strong>
                        </small>
                    </header>
                </div>
                <br>
                <div ng-repeat="detail in examDetail">
                    <header ng-bind="detail.title"></header>
                    <br>
                    <p>@{{detail.question}}</p>
                    <p>@{{detail.choice_a}}&nbsp;&nbsp;&nbsp;@{{detail.choice_b}}&nbsp;&nbsp;&nbsp;@{{detail.choice_c}}&nbsp;&nbsp;&nbsp;@{{detail.choice_d}}</p>
                    <div class="input-field s6">
                        <label for="answers">Answer</label>
                        <input type="text" name="answers" id="answers" ng-model="answers" class="validate">
                    </div>
                </div>
                <hr>
            </div>
            <div class="card-action">
                <button type="submit" class="btn btn-primary btn-xs" ng-click="mobileSubmitExam()">Submit</button>
            </div>
        </div>
    </div>
</div>

i have already test the my api in POSTMAN and it work (using the format below).

answers = {"1": "testing", "2": "testing2"}
student_id = some id
subject_slug = some-subject
subject_id = some id

but i actually used it my backend get null espeacially the tempAnswer. i think the bug is in my angular, is there someone could give some idea or solution much better ^_^. Hoping for your response guys, i am totally new to angular, but i am learning it eagerly.



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire