Was ich vorhabe ist, einen Filechooser zu schreiben, mit welchem man pdf-Dateien auf einen Server hochladen kann, um diese dann abzuspeichern. Was ich fragen wollte ist nur, wie man so etwas am besten bewerkstelligt bzw. ob mein Ansatz sinnvoll ist:
Wenn eine Datei ausgelesen wird, wird qua change event folgende Funktion aufgerufen:
Kann man das so machen? Und falls ja, ist es mein Plan, das uploadDatei-Objekt als BLOB über einen AJAX-Post an ein Servlet zu senden, um es dort irgendwie als pdf wieder abzuseichern. Wie sollte ich da am besten vorgehen?
HTML-Code:
<script type=“text/javascript“> //UI-Events erst registrieren wenn das DOM bereit ist! document.addEventListener("DOMContentLoaded", function() { // Falls neue Eingabe, neuer Aufruf der Auswahlfunktion document.getElementById('file').addEventListener('change', dateiauswahl, false); }); </script> <div id="cv"> <h3>Lebenslauf als pdf hochladen (und somit senden):</h3> Datei wählen: <br /> <input id="file" type="file" name="file" size="50" accept=".pdf" /> </div>
HTML-Code:
function dateiauswahl(evt) { var dateien = evt.target.files; // FileList objekt // Erste Datei auswählen (wichtig, weil IMMER ein FileList Objekt generiert wird) var uploadDatei = dateien[0]; //var dateiname = uploadDatei.name; // Ein Objekt um Dateien einzulesen var reader = new FileReader(); // Wenn der Dateiinhalt ausgelesen wurde... reader.onload = function(theFileData) { if ($('#vorname').val() == '' || $('#nachname').val() == '' || validateEmail($('#mail').val()) == false) { $('#file').val(''); //Instead of an alert, it ought to be possible to set some Text into the DOM using jQuery. alert('Beim senden des Lebenslaufs erst Vor- und Nachname angeben. \nEine angegebene Mailadresse muss valide sein.'); return; } //var file = senddata.fileData = theFileData.target.result; // Ergebnis vom FileReader auslesen /* Code für AJAX-Request hier einfügen */ var xhttp = new XMLHttpRequest(); xhttp.onreadystatechange = function() { //if (this.readyState == 4 && this.status == 200) { //} }; xhttp.open("POST", "FileServlet", true); //xhttp.send(uploadDatei.text()); //TODO: Senden anstellen. Auch Namen und Vornamen senden, diese dann so behandeln wie es der Writer tut. } // Die Datei einlesen und in eine Data-URL konvertieren reader.readAsDataURL(uploadDatei); }