Question

我正在构建测验，我想通过一个电话就可以得到所有问题和答案，并且可以通过AJAX调用来获得它们，因此可以使用javascript逐一显示它们

当我显示第一个问题时，用户选择一个答案并单击“提交”，我想运行另一个ajax请求以检查答案是否正确并返回适当的内容

第二个ajax调用开始时，它返回500（内部服务器错误）

该如何解决？另外，有没有更好的方法来做我想做的事情？从数据库中随机选择的问题是ara，因此刷新表单会再次运行该选择，并且随机性消失了，这就是为什么我要使用ajax调用

也许我可以通过另一种方式从数据库中获取10个问题，然后将它们全部传递给视图，然后在回答问题时按1逐个显示？

我正在寻找有关如何发送第二个电话的解决方案，或者是关于如何更好地编写此代码以实现所需的另一个想法

这是我的表格：

 {!! Form::open(array('class'=>'question ajax challenge', 'id' => 'message')) !!}
    {{--{!! Form::hidden('questionId', $question->id) !!}--}}

    {!! csrf_field() !!}
    {{--<h1 class="question-name">{{ $question->question }}?</h1>--}}
    <h1 class="question-name"></h1>
    <div class="form-group answers"></div>

    {!! Form::submit('Send answer', ['class'=>'btn btn-send']) !!}

    {!! Form::close() !!}
</div>

这是我的JS：

$(document).ready(function () {

var totalQuestions;
var currentQuestion = 0;
var questions = new Array();

$.ajax({
    type: 'POST',
    headers: {
        'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
    },
    url: '/polls/get-questions',
    data: {
        questions: 'questions'
    },
    success: function(questions){

        console.log(questions.questions);

        // for(i=0;i<questions.questions.length;i++){
        //
        //         questionBank[i]=questions.questions[i].question;
        //         questionBank[i]=questions.questions[i].answers;
        //         console.log(questionBank);
        //     }

        for (var i in questions.questions) {
            questions[i]=new Array;
            questions[i][0] = questions.questions[i];
            questions[i][1] = questions.questions[i].answers[0];
            questions[i][2] = questions.questions[i].answers[1];
            questions[i][3] = questions.questions[i].answers[2];
            questions[i][4] = questions.questions[i].answers[3];
        }
        console.log(questions[0]);
        //
        totalQuestions=questions.length;
        //
        displayQuestion(questions[currentQuestion], csrf);
    },
    error: function(xhr){
        console.log(xhr.responseText);
    }
});

function displayQuestion(question, csrf) {

    var rnd=Math.random()*3;
    rnd=Math.ceil(rnd);
    var answer = new Array();

    if(rnd==1){answer[1]=question[1];answer[2]=question[2];answer[3]=question[3];answer[4]=question[4];}
    if(rnd==2){answer[2]=question[4];answer[3]=question[2];answer[4]=question[1];answer[1]=question[3];}
    if(rnd==3){answer[4]=question[1];answer[3]=question[4];answer[1]=question[2];answer[2]=question[3];}

    console.log(question[0]['id']);

    $('.ajax').append('<input type="hidden" name="questionId" value="'+question[0]['id']+'" />');

    $('.question-name').append(question[0].question);

    for(var i=1;i<=4;i++)
    {
        $('.answers').append('' +
            '<div class="radio">' +
            '   <label class="label-for-answer">' +
            '       <div class="input-radio col-md-12">' +
            '           <input id="'+answer[i]['id']+'" class="required answer-box" name="chosenAnswer" type="radio" value="'+answer[i]['id']+'">' +
            '           <label for="'+answer[i]['id']+'"><span class="number-to-letter"></span>'+answer[i]['name']+'</label>' +
            '       </div>' +
            '   </label>' +
            '</div>');
    }


    $('form.ajax').on('submit', function(e){

        var form = $(this);
        $.ajax({
            type: 'POST',
            url: '/polls/message_send',
            headers: {
                'X-CSRF-TOKEN':  $('input[name="_token"]').attr('value')
            },
            dataType:'json',
            data: form.serialize(),

            success: function (response) {
                alert(response.correctSolution);
            }

        });
        e.preventDefault();
    });



    $('.input-radio').click(function(){
        //remove all pre-existing active classes
        $('.main-yellow').removeClass('main-yellow');

        //add the active class to the link we clicked
        $(this).addClass('main-yellow');
    });

}

这是Controller方法，用于检查问题是否为真，并基于此返回json：

    public function proposeSolution(Request $request) {

    $questionId = $request->get('questionId');
    $question = Question::find($questionId);
    $answers = $question->answers()->get()->toArray();

    // Prepare array of proposed answers
    $proposedSolution = [];

    $proposedSolution[] = (int)$request->get('chosenAnswer');

    // Prepare array of correct answers
    $correctSolution = [];

    foreach($answers as $answer) {
        if ($answer['is_correct']) {
            $correctSolution[] = $answer['id'];
        }
    }

    $proposedSolutionResult = ($proposedSolution == $correctSolution);

    // pass to response detailed results on proposed solution
    $proposedSolutionWithDetailedResult = [];

    foreach ($proposedSolution as $answerId) {
        foreach ($answers as $answer) {
            if ($answer['id'] == $answerId) {
                $is_correct = $answer['is_correct'];
            }
        }

        $proposedSolutionWithDetailedResult[$answerId] = $is_correct;

    }

    foreach($proposedSolution as $answerId) {
        foreach ($answers as $answer) {
            if ($answer['id'] == $answerId)
            {
                if($answer['is_correct'] == 1)
                {
                    $quiz_result_score = session('quiz_result_score');
                    session(['quiz_result_score' => ++$quiz_result_score]);
                }
            }
    }
    }

    return response()->json([
        'correctSolution' => $correctSolution,
        'proposedSolutionWithDetailedResult' => $proposedSolutionWithDetailedResult,
        'proposedSolutionResult'=> $proposedSolutionResult
    ]);

第二次Ajax调用返回500内部服务器错误

0 个答案: