Input Default Values (form reset)

by Scott Kaye

HTML

<form action="#">
    <input type="text" value="text" data-default-value="textdefault">
    <input type="tel" value="tel" data-default-value="teldefault">
    <input type="checkbox" checked data-default-value="false">

    <select>
        <option value="select">select</option>
        <option value="defaultselect" data-default-value>defaultselect</option>
    </select>
	
	<textarea data-default-value="textareadefault">textarea</textarea>

    <input type="reset">
</form>

JavaScript

console.clear();

function makeDefaultValue($el, defaultValue) {
    $el = $($el);

    var currentValue, defaultProp, valueProp;

    switch ($el.prop("tagName")) {
        default:
			defaultProp = "defaultValue";

			switch ($el.prop("type")) {
				default:
					currentValue = $el.val();
					valueProp = "value";
					break;
				case "checkbox":
				case "radio":
					defaultProp = "defaultChecked";
					valueProp = "checked";
					currentValue = $el.prop("checked");
					defaultValue = ("" + defaultValue).toLowerCase() === "true";
			}
        	break;
        case "OPTION":
			defaultProp = "defaultSelected";
            defaultValue = true;
            valueProp = "selected";
            currentValue = $el.prop("selected");
    }

    $el.prop({
    	[defaultProp]: defaultValue,
    	[valueProp]: currentValue
    });
}

$("[data-default-value]").each(function() {
    var defaultValue = $(this).data("default-value");
    makeDefaultValue(this, defaultValue);
});