How can I call a function from within a Javascript fetch event?

I'm trying to call startTimer() from within the Javascript fetch().then() call, but it isn't going through.

How can the fetch() see the startTimer() function and execute it?

This happens even when I create an empty test() function that simply prints to console, so I know it isn't related to the code within the startTimer() function.

<script>
        $(document).ready(function(){
            function startTimer(duration, display) {
                var timer = duration, minutes, seconds;
                const interval = setInterval(function () {
                    minutes = parseInt(timer / 60, 10);
                    seconds = parseInt(timer % 60, 10);
                    // minutes = minutes < 10 ? "0" + minutes : minutes;
                    seconds = seconds < 10 ? "0" + seconds : seconds;
                    display.textContent = minutes + ":" + seconds;
                    if (--timer < 0) {
                        clearInterval(interval);
                    }
                }, 1000);
            }
        });

        const form = document.querySelector('#data');
        form.addEventListener('submit', (event) => {
            event.preventDefault();

            var subject = $("#subject").val();
            var sender = $("#sender").val();
            var email = $("#email").val();

            fetch('', {
                method: 'POST',
                headers: { 'Content-Type': 'application/x-www-form-urlencoded' },
                body: new URLSearchParams({
                    'csrfmiddlewaretoken': document.querySelector('[name=csrfmiddlewaretoken]').value,
                    'subject': subject,
                    'sender': sender,
                    'email': email
                })
            })
            .then(response => response.json())
            .then(data => {
                const filename = data.filename;
                const email = data.email;
                startTimer(60, document.querySelector('#timer'));
                var msg = `Your ${filename} was sent successfully to ${email}!`;
                alert(msg);
            })
            .catch(error => {
                alert('Sorry, something went wrong! Please refresh the page and try again.');
            });
        });
    </script>

Back to Top