Booking form works but does not give feedback

Posted by Naim on Stack Overflow See other posts from Stack Overflow or by Naim
Published on 2012-06-07T22:35:55Z Indexed on 2012/06/07 22:40 UTC
Read the original article Hit count: 303

Filed under:
|

I have a form where people can book seats for a given event.
It's actually a WordPress plugin. When someone sends his booking, email notifications are sent properly and the event booking status is updated accordingly.
The issue is that the booking form does not give any feedback whatsoever.
Once you hit "book now", the graphic keeps loading and no feedback is ever displayed like for instance "booking sent successfully" or "there are errors in your form", even though the booking is saved correctly with both sides notified by email.
I guess it's a JavaScript issue,Firebug console is not showing any error...
So here is the code source of the booking form :

Also please experience the issue live Here
username: tester
password: testsa
Thanks!

$('#em-booking-form').submit( function(e){
e.preventDefault();
var em_booking_doing_ajax = false;
$.ajax({
    url: EM.bookingajaxurl,
    data:$('#em-booking-form').serializeArray(),
    dataType: 'jsonp',
    type:'post',
    beforeSend: function(formData, jqForm, options) {
        if(em_booking_doing_ajax){
            alert(EM.bookingInProgress);
            return false;
        }
        em_booking_doing_ajax = true;
        $('.em-booking-message').remove();
        $('#em-booking').append('<div id="em-loading"></div>');
    },
    success : function(response, statusText, xhr, $form) {
        $('#em-loading').remove();
        $('.em-booking-message').remove();
        $('.em-booking-message').remove();
        //show error or success message
        if(response.result){
            $('<div class="em-booking-message-success em-booking-message">'+response.message+'</div>').insertBefore('#em-booking-form');
            $('#em-booking-form').hide();
            $('.em-booking-login').hide();
            $(document).trigger('em_booking_success', [response]);
        }else{
            if( response.errors != null ){
                if( $.isArray(response.errors) && response.errors.length > 0 ){
                    var error_msg;
                    response.errors.each(function(i, el){ 
                        error_msg = error_msg + el;
                    });
                    $('<div class="em-booking-message-error em-booking-message">'+error_msg.errors+'</div>').insertBefore('#em-booking-form');
                }else{
                    $('<div class="em-booking-message-error em-booking-message">'+response.errors+'</div>').insertBefore('#em-booking-form');                           
                }
            }else{
                $('<div class="em-booking-message-error em-booking-message">'+response.message+'</div>').insertBefore('#em-booking-form');
            }
        }
        $('html, body').animate({ scrollTop: $("#em-booking").first().offset().top - 50 }); //sends user back to top of form
        //run extra actions after showing the message here
        if( response.gateway != null ){
            $(document).trigger('em_booking_gateway_add_'+response.gateway, [response]);
        }
        if( !response.result && typeof Recaptcha != 'undefined'){
            Recaptcha.reload();
        }
    },
    complete : function(){
        em_booking_doing_ajax = false;
        $('#em-loading').remove();
    }
});
return false;   
});

© Stack Overflow or respective owner

Related posts about php

Related posts about JavaScript