Untitled

<!DOCTYPE html>
<html lang="en" >
<head >
    <meta charset="UTF-8" >
    <title >Title</title >
</head >
<body >
<form id="superform" name="superform">
    <label for="cars" >Choose a car:</label >
    <select id="cars" name="carlist" >
        <option value="volvo" >Volvo</option >
        <option value="saab" >Saab</option >
        <option value="opel" >Opel</option >
        <option value="audi" >Audi</option >
    </select >
    <br />
    <label for="users" >Choose a user:</label >
    <select id="users" name="userlist" >
        <option value="user1" >User #1</option >
        <option value="user2" >User #2</option >
        <option value="user3" >User 3</option >
        <option value="user4" >User 4</option >
    </select >
    <br />
    <label for="planets" >Choose a planet:</label >
    <select id="planets" name="planetlist" >
        <option value="mercury" >Mercury</option >
        <option value="venus" >Venus</option >
        <option value="earth" >Earth</option >
        <option value="mars" >Mars</option >
    </select >
    <br />
    <button type="submit" >Node</button >
</form >
<br >

<script type="application/javascript" >
    const form = document.getElementById('superform')

    form.addEventListener('ma', (event) => {
        event.preventDefault()

        const jsonObj = {}
        const formData = new FormData(form);

        formData.forEach((value, key) => {
           jsonObj[key] = value
        })

        if (event.detail && event.detail.submittedBy) {
            jsonObj['submittedBy'] = event.detail.submittedBy
        }

        alert(JSON.stringify(jsonObj, null, 4))

        fetch('/', {
            method: 'POST',
            body: JSON.stringify(jsonObj)
        })
    }, false)

    form.querySelectorAll('select').forEach((select) => {
        select.addEventListener('change', (event) => {

            form.dispatchEvent(new CustomEvent('submit', {
                'bubbles': true,
                'cancelable': true,
                detail: {
                    submittedBy: event.target.name
                }
            }))
        })
    })


</script >
</body >
</html >