JavaScript: riportare i valori dei campi dei form al loro stato iniziale

Short link

In JavaScript possiamo riportare i valori dei campi di un form al loro stato iniziale.

Possiamo creare la seguente funzione di utility:


'use strict';

const clearForm = form => {
    let elements = form.querySelectorAll('input, select, textarea');
    Array.prototype.forEach.call(elements, element => {
        let type = element.type;
        let tag = element.tagName.toLowerCase();

        if (/^(text|password|file|tel|email|number)$/i.test(type) || tag == 'textarea') {
			element.value = '';
		} else if (type == 'checkbox' || type == 'radio') {
			element.checked = false;
		} else if (tag == 'select') {
			element.selectedIndex = -1;
		}
    });
};

I valori degli elementi di input di tipo testo e similari vengono impostati su una stringa vuota, le checkbox e le radio vengono private dell'attributo checked e gli elementi select vengono deselezionati, ossia la scelta selezionata viene riportata al valore di partenza.