1

I am slowly learning JavaScript and am working to build a quiz.

So I have got a very basic quiz see here

So my specific questiions are

  1. How would I store the Questions and answers in an external JSON file?
  2. Can I store the Questions and answers in another file type for instance a CSV file?

Maybe I should have a function that goes and gets the Qs&As for me:

function getQuestions() {

}

A working example where possible would be greatly appreciated.

Other thoughts: I know the Javascript/HTML quiz could be written alot better here, that is what I am working towards. I know it could be presented alot better using CSS (currently looking at bootstrap).

Charlie
  • 11,380
  • 19
  • 83
  • 138
HattrickNZ
  • 4,373
  • 15
  • 54
  • 98
  • do you want to use a database? I recommend mongodb or couchdb.. because their data structure is very similar to JSON – s_curry_s Jul 30 '13 at 04:10
  • If you are just trying to create a simple quiz that could easily be figured out by debugging then its easy and I would gladly paste some helpful code. But if you are creating a web service. Then I don't think anyone is going to paste code here for you because the web service could be written in 1000's of different ways with many different script/programming languages. BTW I didn't down vote you just stating possibly why there is a down vote. – shibbybird Jul 30 '13 at 04:13
  • If he is currently learning JavaScript, I doubt he will be able to handle MongoDB or CouchDB now. – ep0 Jul 30 '13 at 04:14
  • d3.js can handle CSV files and embedding extra data into HTML elements , where you could hide the "answers" and check them from javascript. d3 also allows learning graphics. The O'Reilley book by Scott Murray, Interactive Data Visualization, provides a gentle introduction to this d3 javascript library and actually starts with text/table examples. – Paul Jul 30 '13 at 04:17
  • tks for all the comments – HattrickNZ Jul 30 '13 at 04:31
  • - a simple quiz would be fine to start with @Gorkem Yurtseven - a database is maybe where I am workig towards so maybe a simple example if that exists code is fine but sometimes a working example is better as code on its own just leaves me with more questions. having said that working examples are not always possible. – HattrickNZ Jul 30 '13 at 04:43
  • @Paul tks for book reccomendation found it [here](http://chimera.labs.oreilly.com/books/1230000000345/ch06.html) – HattrickNZ Sep 23 '13 at 05:34

3 Answers3

1

Use getJson to load your file and handle data.

In the success function you will have a JSON object.

As for storing data in a CSV file: yes you can, but you would have to parse it

Edit: This approach requires jQuery.

For pure Javascript:

  • make an AJAX call to get the contents of the file
  • JSON.parse() the response.

For making that AJAX call, you should also get familiar with a server-side scripting language.

In php (let's say getQuiz.php):

<?php
     $data = file_get_contents ('quiz');
     echo json_encode($data);
?>

So make a GET request to getQuiz.php and the response will be contents of file quiz encoded as JSON

var xmlhttp;
if (window.XMLHttpRequest) {// code for IE7+, Firefox, Chrome, Opera, Safari
    xmlhttp=new XMLHttpRequest();
}
else {// code for IE6, IE5
    xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}

xmlhttp.onreadystatechange = function() {
    if (xmlhttp.readyState==4 && xmlhttp.status==200) {
        // Here you have your response
        quiz_data = JSON.parse(xmlhttp.responseText);

        // Other code
    }
}
xmlhttp.open("GET","getQuiz.php",true);
xmlhttp.send();
Community
  • 1
  • 1
ep0
  • 710
  • 5
  • 13
  • You should definitely clarify that this depends on using jQuery. – acjay Jul 30 '13 at 04:21
  • "eval() the response." -- don't!!! Even if `eval` is only a fallback for when `JSON.parse` is not available, you should do some pre-check before doing `eval` (`eval` also kills performance, but who cares about IE7 speed, right?) – John Dvorak Jul 30 '13 at 04:45
  • I wrote `eval()`, but used `JSON.parse()` :). You are right. Don't use `eval()` – ep0 Jul 30 '13 at 07:57
1

you can insert a script tag in head like:

<script type="text/json" src="some.cvs" />

web browser cant recognize those script tag,so do not download those files.

use jquery or something find those tag's src attribute.use ajax load those file and parse to json data:

var eles=$("script[type='text/json']").each(function(){
  var cvsurl=$(this).attr("src");
  $.ajax({
    dataType: "json",
    url: ,
    data: data,
    success: function(result){           
        //handling of your json data
     }
  });
})

I just give the method.

coonooo
  • 205
  • 1
  • 4
0

you may use jquery ajax.

$.ajax({
  dataType: "json",
  url: [location of your json file],
  data: data,
  success: 
    function(result){           
        //handling of your json data
    }
});
meborda
  • 391
  • 3
  • 9