Ajax code part and the JavaScript form part of PHP feedback form

Use Fetch API for the JavaScript layer

Keep JavaScript responsible for enhancement and user feedback, not security. Validation and permission checks still belong on the PHP endpoint.

async function submitFeedback(form) {
    const response = await fetch(form.action, {
        method: 'POST',
        body: new FormData(form),
        headers: { 'Accept': 'application/json' }
    });

    const data = await response.json();
    if (!response.ok) {
        throw new Error(data.message || 'Unable to send feedback.');
    }
    return data;
}

The complete example below uses the same Fetch + FormData pattern so the copyable code matches the recommended approach.

The JavaScript is kept inside ajaxFunction(myForm). The function submits the form asynchronously and displays the JSON message returned by the PHP endpoint.

Collecting the form data

The browser collects the form fields with FormData and sends them by POST. This avoids manually assembling and encoding every field.

To display messages we have used one div tag display-msg , you can learn more on how to display messages inside Ajax script here. The full code is here

async function ajaxFunction(myForm) {
    const messageBox = document.getElementById('display-msg');
    messageBox.textContent = 'Data processing...';
    messageBox.style.display = 'inline';

    try {
        const response = await fetch('contactusck-ajax.php', {
            method: 'POST',
            body: new FormData(myForm),
            headers: { 'Accept': 'application/json' }
        });

        const data = await response.json();
        messageBox.textContent = data.message || 'Request completed.';

        if (response.ok && data.status === 'OK') {
            myForm.reset();
        }
    } catch (error) {
        messageBox.textContent = 'Unable to send feedback right now.';
    }
}

function hidemsg() {
    document.getElementById('display-msg').style.display = 'none';
}

Basic of Feedback from

Part 2 HTML part of Feedback from

Part 3 JavaScript code of Ajax Feedback from

part 4 PHP script of Feedback from

PHP Mail

Subhendu Mohapatra

Author & Instructor at plus2net

I write and maintain practical tutorials on Python, PHP, SQL, JavaScript, HTML, jQuery, and web development at plus2net. The tutorials focus on clear explanations, working examples, and code that readers can test and adapt while learning.

About the author Watch on YouTube

Connect:

Subscribe to our YouTube Channel here

Ajax code of PHP Feedback form

Use Fetch API for the JavaScript layer

Collecting the form data

Subhendu Mohapatra