Web-Dev

En udfordring rigtig mange webudviklere støder på, specielt efterhånden som flere og flere er gået over til AJAX-løsninger, er et ønske om at kunne resette et input felt at typen file, men som udgangspunkt er det ikke muligt at nulstille et file input element uden man benytter en reset-knap, som så til gengæld vil nulstille hele formen og det er langt fra altid ønskværdigt. Heldigvis findes der alternative måder at løse dette på, nemlig ved at replace elementet i DOM og det kan fx ske på følgende måde;

function ResetFileInput(elementId) {
  var oldInput = document.getElementById(elementId);
  var newInput = document.createElement("input");
  newInput.type = "file";
  newInput.id = oldInput.id;
  newInput.name = oldInput.name;
  newInput.className = oldInput.className;
  newInput.style.cssText = oldInput.style.cssText;
  oldInput.parentNode.replaceChild(newInput, oldInput);
}

Kalder man ovenståede javascript-funktion med id på sit file input element som parameter vil udfordringen være løst - her et lille eksempel;

<input type="file" id="uploadme" />
<a href="#" onclick="ResetFileInput('uploadme'); return false;">Nulstil</a>

Det vil med en løsning som ovenstående stadigvæk ikke være muligt at sætte value til en foruddefineret værdi - og heldigvis for det da det ville indebære en alvorlig sikkerhedsrisiko.

(X)HTML, JavaScript JavaScript, HTML, input