FormData, fdata

function save_data() {

    // прибираю виділення полів з некоректними значеннями, якщо є
    var inval_elems = main_form.getElementsByClassName("is-invalid");
    for (var i=0; i<inval_elems.length; i++)
    {
        document.getElementById(inval_elems[i].id).classList.remove('is-invalid');
    }

    let main_form = document.forms.mainform
    let fdata = new FormData(main_form);

    fetch("/savedata.py", { method: "POST", body: fdata })

    .then(resp => {
        if (resp.status != 200) {
            alert('danger', ERR_SRV_REFUSED_REQUEST +` Status: ${resp.status}`);
        }
        console.log(resp.status);
        return resp.json();  // return server response as json
    })
    .then(resp => save_data_success(resp))
    .catch(err =>  {
        console.dir(err);
        alert('danger', ERR_RUNTIME)
    });
}

function save_data_success(responce)
{
    console.dir(responce);
    if (responce && 'code' in responce)
    {
        console.log('responce have code=' + responce.code);
        if (responce.code != 0)
        {
            console.log('error');
            alert('danger', responce.data.mess);
            err_elem = document.getElementsByName(responce.data.name)[0];
            err_elem.classList.add('is-invalid');
        }
        else
        {
            console.dir(responce.data);
            alert('success', responce.data.mess);
        }
    }
    else
        alert('danger', "{{ ERR_UNKNOWN_RESPONSE }}");
}

Як вивести в консоль значення полів, які знаходяться в fdata?

Можна використати цикл for...of, щоб перебрати всі значення в FormData. Ось як це зробити:

Варіант 1: Вивід усіх значень у консоль

let fdata = new FormData(document.forms.mainform);

for (let [key, value] of fdata.entries()) {
    console.log(`${key}: ${value}`);
}

Варіант 2: Вивід у вигляді об'єкта

Якщо потрібно отримати всі дані як об'єкт:

let obj = Object.fromEntries(fdata.entries());
console.log(obj);

Варіант 3: Вивід через forEach

fdata.forEach((value, key) => {
    console.log(`${key}: ${value}`);
});

Ці методи допоможуть вивести всі значення полів форми, які містяться у FormData.

Last updated