jQuery ajax returns

Posted by Tom on Stack Overflow See other posts from Stack Overflow or by Tom
Published on 2012-06-21T03:02:45Z Indexed on 2012/06/21 3:16 UTC
Read the original article Hit count: 235

Filed under:
|
|

I think this will be some obvious problem, but I cannot figure it out. I hope someone can help me.

So I have a slider with 3 slides - Intro, Question, Submit

Now I want to make sure that if the question is answered wrong people cannot slide to Submit.

The function to move slide is like this:

function changeSlide(slide){

        // In case current slide is question check the answer
        if (jQuery('.modalSteps li.current',base).hasClass('questionStep')){
            checkAnswer(jQuery('input[name="question_id"]',base).val(), jQuery('input[name="answer"]:checked',base).val());
        }

        jQuery('.modalSteps li.current',base).fadeOut('fast',function(){
            jQuery(this).removeClass('current');
            jQuery(slide).fadeIn('fast',function(){
                jQuery(slide).addClass('current');
            });
        });

        // In case the new slide is question, load the question
        if (jQuery(slide).hasClass('questionStep')){
            var country = jQuery('input[name="country"]:checked',base).val();
            loadQuestion(country);
        }
    }

Now as you can see on first lines, I am calling function checkAnswer, which takes id of question and id of answer and pass it to the AJAX call.

function checkAnswer(question, answer){
        jQuery.ajax({
            url: window.base_url+'ajax/check_answer/'+question+'/'+answer+'/',
            success: function(data){
                if (!data.success){
                    jQuery('.question',base).html(data.message);
                }
            }
        });
    }

The problem i am having is that I cannot say

if(checkAnswer(...)){}

Because of Ajax it always returns false or undefined. What I need is something like this:

 function changeSlide(slide){

        // In case current slide is question check the answer
        if (jQuery('.modalSteps li.current',base).hasClass('questionStep')){
            if (!checkAnswer(jQuery('input[name="question_id"]',base).val(), jQuery('input[name="answer"]:checked',base).val())){
              return false;
            }
        }
...

So it will prevent the slide from moving on.

Now when Im thinking about it, I will probably have slide like "Wrong answer" so I could just move the slide there, but I would like to see the first solution anyway.

Thank you for tips

© Stack Overflow or respective owner

Related posts about JavaScript

Related posts about jQuery