php - 各回答ボタンへのマークの付け方

Question

チェックボックスボタンとして表示される各質問に対する可能な回答のリストを表示するコードを以下に示します。私がやりたいのは、データベースから取得できる各回答ボタンにマークを関連付けることです。正解の場合は、db からマークを取得します。間違った答えの場合、それらのマークはそれぞれ0の価値があります。私の質問は、これを行うための最良の方法と方法です:

DB テーブル:

質問：

QuestionId (PK auto)  QuestionNo  SessionId (FK Session) OptionId (FK Option)    
72                    1           26                     3
73                    2           26                     4

Option_Table:

OptionId (PK Auto)  OptionType
1                   A-C
2                   A-D
3                   A-E
4                   A-F

答え：

AnswerId (PK auto)    QuestionId (FK Question)      Answer  
1                          72                         C             
2                          73                         A             
3                          73                         C             
4                          73                         D

個人_回答:

AnswerId (PK auto)  AnswerMarks
1                   2
2                   2
3                   1
4                   2

以下のコードは、クエリをコンパイルし、各質問の回答ボタンをコンパイルします。

    $qandaquery = "SELECT q.QuestionId, q.QuestionNo, o.OptionType, GROUP_CONCAT( DISTINCT Answer
                    ORDER BY Answer
                    SEPARATOR ',' ) AS Answer
                    FROM Question q
                    LEFT JOIN Answer an ON q.QuestionId = an.QuestionId
                    LEFT JOIN Individual_Answer ia ON an.AnswerId = ia.AnswerId
                    LEFT JOIN Option_Table o ON q.OptionId = o.OptionId
                    ";

    global $mysqli;
    $qandaqrystmt=$mysqli->prepare($qandaquery);
    // get result and assign variables (prefix with db)
    $qandaqrystmt->execute(); 
    $qandaqrystmt->bind_result($qandaQuestionId,$qandaQuestionNo,$qandaOptionType,$qandaAnswer);

    $arrQuestionId = array();
    $arrQuestionNo = array();
    $arrOptionType = array();
    $arrAnswer = array();
    $arrReplyType = array();

foreach ($arrQuestionId as $key=>$question) {

?>

<div class="queWrap">

//LOOP THROUGH EACH QUESTION
<p><?php echo "<strong>".htmlspecialchars($arrQuestionNo[$key])."</strong>"; ?></p>

//BELOW DISPLAYS THE ANSWER BUTTONS FOR EACH QUESTION
$options = explode('-', $arrOptionType[$key]);
if(count($options) > 1) {
    $start = array_shift($options);
    $end = array_shift($options);
    do {
        $options[] = $start;
    }while(++$start <= $end);
 }
 else{
    $options = explode(' or ', $option);
 }

       foreach($options as $indivOption) {
     echo '<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-' . $indivOption . '" value="' . $indivOption . '" /><span>' . $indivOption . '</span></label></div>';
 }
?>

//HIDDEN INPUT SHOWING DB's QUESTIONID FOR EACH QUESTION
<p><input type='hidden' class='questionIds' name='questionids' value='<?php echo htmlspecialchars($arrQuestionId[$key]); ?>' /></p>

</div>


<?php

}

?>

以下は、2 つの質問とその回答を表示するソースコードです。

    <div class="queWrap">

    //QUESTION 1

    <p><strong>1:</strong></p>

    //ANSWER BUTTONS FOR QUESTION 1

    <div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-A" value="A" /><span>A</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-B" value="B" /><span>B</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-C" value="C" /><span>C</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-D" value="D" /><span>D</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-E" value="E" /><span>E</span></label></div>

    //QUESTIONID FOR QUESTION 1

    <p><input type='text' class='questionIds' name='questionids' value='72' /></p>

    </div>

    <div class="queWrap">

    //QUESTION 2

    <p><strong>2:</strong></p>

    //ANSWER BUTTONS FOR QUESTION 2

    <div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-A" value="A" /><span>A</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-B" value="B" /><span>B</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-C" value="C" /><span>C</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-D" value="D" /><span>D</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-E" value="E" /><span>E</span></label></div>
<div class="ck-button"><label class="fixedLabelCheckbox"><input type="checkbox" name="options_<?php echo $key; ?>[]" id="option-F" value="F" /><span>F</span></label></div>

    //QUESTIONID FOR QUESTION 2

    <p><input type='text' class='questionIds' name='questionids' value='73' /></p>

    </div>

score 1 · Accepted Answer

チェックボックスが選択されるたびに、サーバーに AJAX リクエストを送信できます。これにより、すべての回答をサーバーに保持し、そこで進行状況を監視できます。

最初にdata-、追加の入力を使用して質問 ID を保存するのではなく、属性を質問ラッパーに追加します。

<div class="queWrap" data-q_id="72">

jQuery:

$function(){
    $('.queWrap input:checkbox').change(function() {
        var $ch_box = $(this),
            $qwrap=$ch_box.closest('.queWrap')
            q_id = $qwrap.data('q_id'),
            val = $ch_box.val();

        var dataToServer = {
            q_id: q_id,
            valueSelected: val
        }

        /* due to demo environment sending dummy data*/

        $.post('/echo/json/', dataToServer, function (response) {
            /* disable checkboxes for this question- would need to track at server that user only submits once for each question*/
            $qwrap.find('input:checkbox').prop('disabled',true);
             /* demo uses JSON response {"status":"correct"}*/
            var status=response.status
            $qwrap.find('.status').text( status).addClass(status);
        });    
    });
});

デモ: http://jsfiddle.net/bWthd/

php - 各回答ボタンへのマークの付け方

1 に答える 1

Related

Reference