Categories: Uncategorized

jQuizMe 2.0 Released.

Hey everyone,

jQuizMe 2.0: Features a everything you need to make a javascript quiz online.

After a few months of programming I’ve finally finish jQuizMe. It took a some time to get done but it feels rewarding.

Anyhow, jQuizMe 2.0 is at code.google now.

http://code.google.com/p/jquizme/

Please post a issues at jQuizMe on Github.com

Larry Battle

I love to program, and discover new tech. Check out my stackoverflow and github accounts.

View Comments

  • Just looking at your post on my brand new Garmin Phone , and I wanted to check if it would let me comment or if it was going to me go to a full pc to do that. Ill check back later to see if it worked.

  • Just want to tell you that your site content is interesting, but you must improve site graphics

  • In multiList type, it's possible to answer by just selection the radio button and not by clicking on the "check" button?
    How can I hide "quit" and "help" buttons? only with css?
    Is it possible to hide the questions when showing the result of each one?
    Many thanks!

    • Hides the quit and help buttons.

      var options = {};
      options.statusUpdate = function( info, $quiz ){
          $(".q-help").hide();
      }
      $(el).jQuizMe( quiz, options );
      

      I'll get back to you on the other questions.

      • Thanks Larry!
        The most important one for me right now is to hide the answer's when showing if the answer is correct or not, like question/answers - result - new question/answers.
        Thanks!

        • I updated the wiki to include too missing options.
          options.showAns and options.showAnsInfo.

          But about your problem. This will be fixed in the next release. I'll add an option for it. The next jQuizMe should be out by next sunday, July 12.
          But... if you need it asap. Just send me an email and I'll give you a modified version.

      • Btw, in case other people need this the params according to the wiki are others, Larry:

        statusUpdate: function( quizInfo, currQuiz ){
        $(".q-help").hide();
        }

        Many thanks and still waiting for you help about hidding the answer's when showing the result :)

        • Use $(“.q-help”, currQuiz ).hide(); instead of $(“.q-help”).hide();.
          So that way you only mess with the quiz that the function is corresponding to.

    • Hey Bruno,
      Here are two hacks for jQuizMe. You need to use jQuery 1.4.2 for these to work.
      These simple hacks are taking advantage of jQuery's delegate function.
      jQuery Delegate: http://api.jquery.com/delegate/

      1) When using the "multiList" quiz type, auto-click the check button when an answer is selected.
      Solution:
      ### Code ###
      $( "#quizArea" ).delegate( ".q-ol-li", "click", function(e){
      var $checkBtn = $(e.target).parent().parent().parent().parent().find( ".q-check-btn" );
      $checkBtn.click();
      });
      ### End of Code ###

      2) When using the "multiList" quiz type, hide the question and answer when showing the result of the answer selection.
      Solution:
      ### Code ###
      $(".q-check-btn").click( function(){
      $( e.target ).parent().parent().find( ".q-ansSel, .q-ques" ).slideToggle();
      });
      ### End of Code ###

      Note: Change "#quizArea" to the appropriate selector that contains the jQuizMe element.

  • Larry, thanks a lot!
    I've send you some e-mail with my situation and with a bug that I found on ans that isn't handling arrays correctly.
    Waiting for your answer as soon as possible.
    Many thanks!

  • Hi. Thanks for this nice plugin. I try to use your plugin with Ezmark Checkbox and Radio button plugin. But because my javascripting is not good, i could figure out to make them work. Actually i can make Ezmark work in first stage as changing button, but when user click, the button does not change at all but your script got the answer and work. I think this is because both relay on :checked attribute. Can you offer me a way to solve this problem?

    • I spent some time reviewing the code and discovered that the plugin ezMark is geared more towards inputs in forms.
      Since jQuizMe doesn't use the form tag and assign radio inputs with names, then ezMark will fail.
      Therefore, unless ezMark is modified, it *should* not work properly with jQuizMe.

  • Hey Larry,

    Great work on the plugin!

    Is there a way to add a custom text summary to the end of the quiz? Something like

    "Thank you for taking our quiz! If you would like more information, click here" Etc Etc

    Also, is there a way to always show ansInfo regardless if the question was correct or incorrect? Currently it only shows if the question was incorrect.

    Thanks for everything!
    -Ronnie

    • In jQuizMe, the ansInfo property is only shown when the user answer is incorrect. So I will have to change that feature to allow you to show the ansInfo property every time.

      options.statusUpdate will help for triggering quiz events.
      You can find that in "release jQuizMe 2.1/demo/simple guide/" or at the link below.
      http://www.bateru.com/jquery/jquizme2.1/demo/Simple_guide/jquizme-settings-updated.html
      Something like the following might help you get started.

      ... // declare quiz and options
      options.statusUpdate = function( quizInfo, $currQuiz ){
      if( quizInfo.hasQuit ){
      alert( "Thank you for using jQuizMe. \n For More information google 'jQuizMe'." );
      }
      };
      jQuizMe( quiz, options );

  • I'm hoping to use this for my online courses. I'm wondering if there's a way to get the plugin to pull questions from a MySQL database. Would that require JSON? Is there a pure PHP solution? Otherwise all questions have to be hardcoded in the JS, right?

    • No, not all quizzes have to be saved in JavaScript Files. You can create a quiz by retrieving the information from a MySQL database. Here's how.
      Basically to create the quiz, you send out an ajax command to a PHP page that echos back an JSON file with your questions.
      To echo back JSON using PHP, connect to and query your database whiling storing the results in an associated array.
      Next, convert the stored array into JSON by using the JSON_encode function.
      jQuery Ajax

      var quiz = $.ajax({
            url: "script.php",
            global: false,
            type: "POST",
            data: "topic=chemistry",
            async:false
         }
      ).responseText;
      //Note: quiz can be in the format [ { ques: "", ans:"" }, ... ];
      

      Hope that's helps.

      • Hi Larry,

        I've been trying your solution to do the same as Nathan, getting my quiz-questions from a mysql database.

        Unfortunately I'm not skilled in JSON.... I can get my questions out of the database and in an associated array. But how do you call the array in the javascript var quiz?
        And what does data:"topic=chemistry" stand for?

        Sorry for my questions,but I would love to use jQuizMe.

        Thanks!

  • hi!
    I very very stupid question I guess..

    In css and in the Options table there some Abbreviations I'm not able to undestand

    in the q-ol-el

    el = External Links ?

    in the animationCode: EL, ON, SPD (speed, ok) what EL and ON stand for??

    Last thing, Is it possible to share translations to other languages? If not already present, I'll be happy to translate it in Italian.

  • Hi, Larry

    Your quiz is amazing

    I'm trying to test a multiList Jquizme
    with possibility to select multiple answers
    after readind the doc, I try an array
    but it doesn't work well
    the quizz show:
    B.answer1,answer2
    did I do wrong ?
    could you give some help please

    • Sorry about the late responds. There a bug with word press.
      Anyhow, currently jQuizMe only supports selecting one answer, as in receiving only one answer input from the user.
      A new feature will be added to support receiving and checking multiple answer choices for the multiple choice quiz type.

  • Hi Larry,

    I have run into a problem that i was hoping you could help me with. The problem I am having involves html tags in the answer of a multiList quiz type.

    For some reason, if i use an html tag in the answer, it will not recognize as being the right answer. For instance:

    ans: "1 x 1013",

    This displays properly, but when selecting it as the right answer, it flags it as wrong.

    To troubleshoot i changed showHTML to false which did recognize it as the right answer, but obviously i can't use this since it displays the code.

    I don't remember having this problem before. I have tried even the simplest of tags such, and , but if there is any html in the answer it will not recognize it as the right answer.

    I am using version 2.1. Thanks for any help on the issue. THANKS AGAIN for your awesome work on this project and sharing with us.

    ...another, well deserved, donation coming soon. :)

    • looks like the html tags i entered rendered. Below is revised:

      I don’t remember having this problem before. I have tried even the simplest of tags such as [em] and [strong] but if there is any html in the answer it will not recognize it as the right answer.

      I am using version 2.1. Thanks for any help on the issue. THANKS AGAIN for your awesome work on this project and sharing with us.

      • I like to know, if the problem is solved?
        I try to use img tags for answers, but the same result.
        For pictorial quiz shell be useful this posibility.
        I solve the problem that I place answer images in questions area a answers I write as text in ans: "A", "B", ..., but
        I thing the first way shell be more elegant.
        It is a metod how to manage it?

        • Shae's Issue was taken care of through a private message.

          I think the problem was not enabling options.showHTML.

          I'm sorry but I didn't fully understand what you wrote.
          Please explain your problem again, so that I can better assist you.

          If possible, could you also provide a test file?

1 3 4 5 6 7 9
Share
Published by
Larry Battle

Recent Posts

What really is Data Science? Told by a Data Scientist

What REALLY is Data Science? Told by a Data Scientist - By Joma Tech

7 years ago

Video: How Water Towers Work

How Water Towers Work - Practical Engineering

7 years ago

Dev Tip: Simple tips to improve code reviews

Writing perfect code is a challenging process. That's where code reviews come in to help…

7 years ago

Video: How AI will change the 3d industry

"The Next Leap: How A.I. will change the 3D industry - Andrew Price - Blender"

7 years ago

Best Software Presentation for 2018

"Captain Disillusion: World's Greatest Blenderer - Live at the Blender Conference 2018 - CaptainDisillusion"

7 years ago

Dev Video: A Few Linux Shell Tips

My 5 Favorite Linux Shell Tricks for SPEEEEEED (and efficiency) - By tutoriaLinux > What's…

7 years ago