i have created quiz application bu tin calculation of score i am getting error lthtmlgt ltheadgtlttitlegtgopilttitlegt ltbodygt ltdiv id34quesRes34gtltdivgtltscriptgt var quizObj 34question34 34What is the capital of Bangladesh34 34choice34 34Dhaka34 34Chittagong34 34Sylhet34 34correct34 0 34question34 34What does 22 equal to34

Hi srigopi111I have gone through the code and its seems to bit difficult to get the correct reault using javascript and lot of workaround need to be done so better to use jQuery for generating the ResultsI have created a sample which full fill your requirementHTMLlthtml xmlns34httpwwww3org1999xhtml34gtltheadgt lttitlegtgopilttitlegtltheadgtltbodygt ltdiv id34quesRes34gt ltdivgt ltscript type34textjavascript34 src34httpscdnjscloudflarecomajaxlibsjquery183jqueryminjs34gtltscriptgt ltscript type34textjavascript34gt var quizObj 34question34 34What is the capital of Bangladesh34 34choice34 34Dhaka34 34Chittagong34 34Sylhet34 34correct34 0 34question34 34What does 22 equal to34 34choice34 34334 34234 34434 quizO

Implement Quiz application using jQuery in ASP.Net

srigopi1...

SOLVED CLOSED ACTIVE ANSWERED
User: srigopi111
Posted: on May 29, 2017 03:45 AM
Forum: jQuery and jQuery Plugins
Answer: 1
Views: 7968

i have created quiz application bu tin calculation of score i am getting error

  <html>
  <head><title>gopi</title>
  <body>
  <div id="quesRes"></div>
<script>

    var quizObj = [
    { 
        "question": "What is the capital of Bangladesh?",
        "choice": ["Dhaka", "Chittagong", "Sylhet"],
        "correct":  0
   },
   { 
        "question": "What does 2+2 equal to?",
        "choice": ["3", "2", "4"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 2
   },
    { 
        "question": "What is the real name of Damon Salvatore?",
        "choice": ["Paul Wesley", "Steven McQueen", "Ian Somerhalder"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 2
   },
    { 
        "question": "What is the name of the largest planet in the universe?",
        "choice": ["Earth", "Jupiter", "Uranus"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 1
   },
    { 
        "question": "What is the capital of New York?",
        "choice": ["Manhattan", "NYC", "Albany"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 2
   },
    { 
        "question": "How many bones does the human body have?",
        "choice": ["109", "206", "114"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 1
   },
    { 
        "question": "What is the alter ego of Batman?",
        "choice": ["Bruce Banner", "Bruce Wayne", "Tony Stark"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 1
   },
    { 
        "question": "How many books are there in the Harry Potter series?",
        "choice": ["7", "5", "8"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 0
   },
    { 
        "question": "What is Naruto's surname?",
        "choice": ["Sarutobi", "Uchiha", "Uzumaki"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 2
   },
    { 
        "question": "What is the name of Sherlock Holmes' partner?",
        "choice": ["Peterson", "Watson", "Hanson"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 1
   },

];

  var track = [];

    var maxQues = prompt("How many questions do you want to answer?", "5");
    var rand = Math.floor(Math.random() * maxQues);

    var str='<h4>Answer all the questions</h4>';

    for(var i=0;i<maxQues;i++){

        var rand = Math.floor(Math.random() * maxQues);
        str+=(i+1)+'.  '+quizObj[rand].question+'<br>';
        str+='<form><table>'+
            '<tr><td id="a1"><input type="radio" name="radio' + i + '"/>'+'&nbsp;&nbsp;'+quizObj[rand].choice[0]+'</td></tr>'+
            '<tr><td id="a2"><input type="radio" name="radio' + i + '" />'+'&nbsp;&nbsp;'+quizObj[rand].choice[1]+'</td></tr>'+
            '<tr><td id="a3"><input type="radio" name="radio' + i + '"/>'+'&nbsp;&nbsp;'+quizObj[rand].choice[2]+'</td></tr>'+
        '</table></form><br>';
    track[i]=rand;
    }
    str += '<input value="Submit" type="button" onclick="scoreMe()"><br><br>';
    str += 'Score: <input id="score" type="text" size="8" ><br><br><br>';
    document.getElementById('quesRes').innerHTML = str;

  function scoreMe(){
    var sum=0;
    for(var j=0;j<maxQues;j++){
      for(var k=0;k<3;k++){
        if(quizObj[track[j]].choice[k].checked===quizObj[track[j]].correct[0]){
          console.log('Works'+j);
          sum++;
        }
      }
    }
    document.getElementById('score').value = ((sum/maxQues)*100)+'%';
  }
</script>
</body>
</head>
</html>

Download FREE API for Word, Excel and PDF in ASP.Net

AnandM

0 4

Reply
ANSWER
User: AnandM
Replied: on May 31, 2017 07:21 AM
Report

Hi srigopi111,

I have gone through the code and its seems to bit difficult to get the correct reault using javascript and lot of workaround need to be done so better to use jQuery for generating the Results.

I have created a sample which full fill your requirement.

HTML

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>gopi</title>
</head>
<body>
    <div id="quesRes">
    </div>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script type="text/javascript">

        var quizObj = [
    {
        "question": "What is the capital of Bangladesh?",
        "choice": ["Dhaka", "Chittagong", "Sylhet"],
        "correct": 0
    },
   {
       "question": "What does 2+2 equal to?",
       "choice": ["3", "2", "4"],  //quizObj[2].choice[0],quizObj[2].choice[1]
       "correct": 2
   },
    {
        "question": "What is the real name of Damon Salvatore?",
        "choice": ["Paul Wesley", "Steven McQueen", "Ian Somerhalder"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 2
    },
    {
        "question": "What is the name of the largest planet in the universe?",
        "choice": ["Earth", "Jupiter", "Uranus"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 1
    },
    {
        "question": "What is the capital of New York?",
        "choice": ["Manhattan", "NYC", "Albany"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 2
    },
    {
        "question": "How many bones does the human body have?",
        "choice": ["109", "206", "114"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 1
    },
    {
        "question": "What is the alter ego of Batman?",
        "choice": ["Bruce Banner", "Bruce Wayne", "Tony Stark"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 1
    },
    {
        "question": "How many books are there in the Harry Potter series?",
        "choice": ["7", "5", "8"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 0
    },
    {
        "question": "What is Naruto's surname?",
        "choice": ["Sarutobi", "Uchiha", "Uzumaki"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 2
    },
    {
        "question": "What is the name of Sherlock Holmes' partner?",
        "choice": ["Peterson", "Watson", "Hanson"],  //quizObj[2].choice[0],quizObj[2].choice[1]
        "correct": 1
    },

];

        var track = [];

        var maxQues = prompt("How many questions do you want to answer?", "5");
        var rand = Math.floor(Math.random() * maxQues);
        var str = '<h4>Answer all the questions</h4>';

        for (var i = 0; i < maxQues; i++) {

            var rand = Math.floor(Math.random() * maxQues);
            str += (i + 1) + '.  ' + quizObj[rand].question + '<br>';
            str += '<form><table>' +
            '<tr><td id="a1"><input type="radio" name="radio' + i + '" class="checkBox' + i + '" value="0" />' + '&nbsp;&nbsp;' + quizObj[rand].choice[0] + '</td></tr>' +
            '<tr><td id="a2"><input type="radio" name="radio' + i + '" class="checkBox' + i + '" value="1" />' + '&nbsp;&nbsp;' + quizObj[rand].choice[1] + '</td></tr>' +
            '<tr><td id="a3"><input type="radio" name="radio' + i + '" class="checkBox' + i + '" value="2" />' + '&nbsp;&nbsp;' + quizObj[rand].choice[2] + '</td></tr>' +
        '</table></form><br>';
            track[i] = rand;
        }
        str += '<input id="btnCalculate" value="Submit" type="button" /><br><br>';
        str += 'Score: <input id="score" type="text" size="8" /><br><br><br>';
        document.getElementById('quesRes').innerHTML = str;

        $(function () {
            $('#btnCalculate').click(function () {
                var sum = 0;
                for (var i = 0; i < maxQues; i++) {
                    if ($('input[name="radio' + i + '"]:checked').val() == quizObj[track[i]].correct) {
                        sum++;
                    }
                }
                document.getElementById('score').value = ((sum / maxQues) * 100) + '%';
                return false;
            });
        });        
    </script>
</body>
</html>

Demo

I agree, here is the link: https://www.e-iceblue.com/Introduce/spire-office-for-net-free.html

Implement Quiz application using jQuery in ASP.Net

Company

Explore

Follow us

Contact Us