如何标记每个答案键关联 [英] How to associate marks for each answer button

问题描述

我下面那里显示可能的答案显示为复选框按钮每个问题的清单一张code。我想要做的就是准标记每个答案按钮，可以从数据库中检索。为了正确答案检索数据库的痕迹。对于不正确的答案其标志是每个价值为0。我的问题是如何和什么是做到这一点的最佳方式：

I have a piece of code below where it displays a list of possible answers for each question displayed as checkbox buttons. What I want to do is associate marks for each answer button which can be retrieved from the db. For correct answers retrieve their marks from db. For incorrect answers their marks are each worth 0. My question is how and what is best way to do this:

数据库表：

问：

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    

Individual_Answer：

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

code

Below is Source Code which displays 2 questions and their answers:

下面是源$ C ​​$ C可显示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>

推荐答案

您可以一个复选框被选中，每次做一个AJAX请求到服务器。这可以让你把所有的答案服务器和监控进度存在。

You could make an AJAX request to server every time a checkbox is selected. This allows you to keep all answers on server and monitor progress there.

首先，我想补充一个数据 - 属性质疑的包装，而不是使用一个额外的输入存储问题ID：

First I would add a data- attribute to question wrapper rather than using an extra input to store question ID:

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

jQuery的：

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/

这篇关于如何标记每个答案键关联的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！