Javascript / HTML - Rensa "required" input vid knapptryck
Har än en gång fastnat med mina experiment och behöver lite hjälp.
Det jag försöker göra är att rensa all input från ett formulär när man klickar på "submit"-knappen.
Problemet är att input-taggen har "required"-attribut och att scriptet då verkar rensa bort det man skrivit in innan det skickas iväg och gör att fälten töms och får den här lilla varningsrutan om att man skall fylla i fälten.
<input id="firstName" type="text" required />
<input id="lastName" type="text" required />
<input id="email" type="text" required />
På min "submit"-knapp kör jag denna JS-snutt (lade dit lite kommentarer för att underlätta, eller försvåra...)
<button value="Submit" onclick="insert()">Submit</button>
// Stoppar in div-taggarna i variabler
var inputFirstname = document.getElementById("input_value_firstname");
var inputLastname = document.getElementById("input_value_lastname");
var inputEmail = document.getElementById("input_value_email");
function insert(){
// Rensar div-taggar så att input inte ligger kvar om man fyller i formuläret igen
inputFirstname.innerHTML = "";
inputLastname.innerHTML = "";
inputEmail.innerHTML = "";
// Plockar upp input som anges i formulär
var firstName = document.getElementById("firstName").value;
var lastName = document.getElementById("lastName").value;
var email = document.getElementById("email").value;
// Petar in input till div-taggar
inputFirstname.innerHTML += firstName;
inputLastname.innerHTML += lastName;
inputEmail.innerHTML += email;
// Kör funktion för rensning utav input
clearInput();
}
function clearInput(){
// Nollar input-värdet
firstName.value = "";
lastName.value = "";
email.value = "";
}
Kan ju snyggas till med jQuery men nu ser det ut som det gör och det fungerar, förutom problemet att fälten raderas och inte vill skickas vidare.
Någon som kan komma på en lösning? Vill helst ha kvar required-attributet.
Grubblare