Called and canceled of the admin-ajax.php file multiple times

Question

I have an issue in a Wordpress installation with a plugin. There is a calendar which you can click on a day (or a range of days) and from ajax calls through admin-ajax.php it calculates product costs.

The problem is that, when I click on a calendar cell, the admin-ajax.php is called twice. The first time for a few milliseconds and canceled immediately. Then automatically, it calls it once again and get the ajax response. When I click for a second time on a calendar cell, the admin-ajax.php is called 3 times. The first two are canceled and only the last one get a response.

I found that the code that is used for this part is the following. However, I cannot find any issue on it, even if I can see those cancelled calls on Developer console.

$('.wc-bookings-booking-form')
        .on('change', 'input, select', function() {
            var index = $('.wc-bookings-booking-form').index(this);

            if ( xhr[index] ) {
                xhr[index].abort();
            }

            $form = $(this).closest('form');

            var required_fields = $form.find('input.required_for_calculation');
            var filled          = true;
            $.each( required_fields, function( index, field ) {
                var value = $(field).val();
                if ( ! value ) {
                    filled = false;
                }
            });
            if ( ! filled ) {
                $form.find('.wc-bookings-booking-cost').hide();
                return;
            }

            $form.find('.wc-bookings-booking-cost').block({message: null, overlayCSS: {background: '#fff', backgroundSize: '16px 16px', opacity: 0.6}}).show();

            xhr[index] = $.ajax({
                type:       'POST',
                url:        booking_form_params.ajax_url,
                data:       {
                    action: 'wc_bookings_calculate_costs',
                    form:   $form.serialize()
                },
                success:    function( code ) {
                    if ( code.charAt(0) !== '{' ) {
                        console.log( code );
                        code = '{' + code.split(/\{(.+)?/)[1];
                    }

                    result = $.parseJSON( code );

                    if ( result.result == 'ERROR' ) {
                        $form.find('.wc-bookings-booking-cost').html( result.html );
                        $form.find('.wc-bookings-booking-cost').unblock();
                        $form.find('.single_add_to_cart_button').addClass('disabled');
                    } else if ( result.result == 'SUCCESS' ) {
                        $form.find('.wc-bookings-booking-cost').html( result.html );
                        $form.find('.wc-bookings-booking-cost').unblock();
                        $form.find('.single_add_to_cart_button').removeClass('disabled');
                    } else {
                        $form.find('.wc-bookings-booking-cost').hide();
                        $form.find('.single_add_to_cart_button').addClass('disabled');
                        console.log( code );
                    }
                },
                error: function() {
                    $form.find('.wc-bookings-booking-cost').hide();
                    $form.find('.single_add_to_cart_button').addClass('disabled');
                },
                dataType:   "html"
            });
        })
        .each(function(){
            var button = $(this).closest('form').find('.single_add_to_cart_button');

            button.addClass('disabled');
        });

And here is a screenshot from the Dev Console:

EDIT: I think I found the problem, but I am not sure. There is also this part of code which was supposed to not used at all. There is a feature for time on calendar, but it isn't activated. So, this code should not be run.

$('.wc-bookings-booking-form').on( 'date-selected', function() {
        show_available_time_blocks( this );
    });

    var xhr;

    function show_available_time_blocks( element ) {
        var $form               = $(element).closest('form');
        var block_picker        = $form.find('.block-picker');
        var fieldset            = $form.find('.wc_bookings_field_start_date');

        var year  = parseInt( fieldset.find( 'input.booking_date_year' ).val(), 10 );
        var month = parseInt( fieldset.find( 'input.booking_date_month' ).val(), 10 );
        var day   = parseInt( fieldset.find( 'input.booking_date_day' ).val(), 10 );

        if ( ! year || ! month || ! day ) {
            return;
        }

        // clear blocks
        block_picker.closest('div').find('input').val( '' ).change();
        block_picker.closest('div').block({message: null, overlayCSS: {background: '#fff', backgroundSize: '16px 16px', opacity: 0.6}}).show();

        // Get blocks via ajax
        if ( xhr ) xhr.abort();

        xhr = $.ajax({
            type:       'POST',
            url:        booking_form_params.ajax_url,
            data:       {
                action: 'wc_bookings_get_blocks',
                form:   $form.serialize()
            },
            success: function( code ) {
                block_picker.html( code );
                resize_blocks();
                block_picker.closest('div').unblock();
            },
            dataType:   "html"
        });
    }