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}} @{{studentDetail.middlename[0]}}. @{{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}} @{{detail.choice_b}} @{{detail.choice_c}} @{{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