I call a private function _checkCompletion() in a Stimulus.js controller. The private function sends an Ajax call and given its result, it should return true or false. However, the allValidated variable is undefined after the private function is called.

Here is my stimulus method:

nextQuestion() {
    var container = this.containerTarget;

    var moduleSlug = this.continueBtnTarget.getAttribute("data-course-module-slug");
    var allValidated = this._checkCompletion(moduleSlug);
    if(allValidated == true) {  
        container.classList.remove("active");

        document.getElementById("quiz-result-container").style.display = "block";
    }
}

Here is the private function:

_checkCompletion(moduleSlug) {
    $.ajax({
        url: "/check_module_completion",
        method: 'post',
        beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))},
        data: {
            course_module_slug: moduleSlug
        },
        success: function(data) {
            console.log(data['value']);
            if (data['value'] == 'true') {
                return true;
            } else {
                return false;
            }
        },
        error: function() {
            console.log("Ajax error!");
        },
    })

}

Any idea what I am doing wrong? I tried to change the private function into a normal function after the stimulus controller function _checkCompletion() { ... } but the allValidated variable is also undefined.

I verified and moduleSlug is defined.

Thanks.