Moin Community,
ich arbeite aktuell an einem kleinen Projekt wo im Endeffekt ein kleines Vorlagen Tool werden soll. Ich habe quasi eine Index mit Dropdown-Menü, welche mir die Vorlagen spezifisch zum Thema die angelegte HTML Datei anzeigt. Jetzt soll da allerdings noch ein Bereich rein, mit der man quasi über die Website die Vorlage bearbeiten kann und im gleichen Ordner wieder gespeichert wird.
Ich habe es zwar geschafft, dass ich die HTML Datei auslesen kann und anschließend auch speichern kann, allerdings bekomm ich es nur so hin, dass ich immer manuell den Ordner auswählen muss und das Script nicht die Datei im gleichen Ordner wieder speichert, aus dem ich die Datei geladen habe.
Hat jemand vlt. Eine Idee wie man das machen kann? Ich kämpf daran jetzt schon seit 3 Wochen und außer das ich endliche Wege gefunden habe wie man das Script zerstören kann bin ich nicht mehr weiterkomme.
<!DOCTYPE html>
<html class=" js no-touch" lang="en"><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<meta charset="utf-8">
<title>Backup erstellen</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="Your page description here">
<meta name="author" content="">
<!-- css -->
<link href="../css/menu.css" rel="stylesheet">
<style type="text/css"><!--
body {
background-color: #FFFFFF;
margin-left: 1em;
}
</style>
<script type="text/javascript">
function saveTextAsFile()
{
var textToSave = document.getElementById("inputTextToSave1").value;
var textToSaveAsBlob = new Blob([textToSave], {type:"text/html"});
var textToSaveAsURL = window.URL.createObjectURL(textToSaveAsBlob);
var fileNameToSaveAs = document.getElementById("inputFileNameToSaveAs1").value;
var downloadLink = document.createElement("a");
downloadLink.download = fileNameToSaveAs;
downloadLink.innerHTML = "Download File";
downloadLink.href = textToSaveAsURL;
downloadLink.onclick = destroyClickedElement;
downloadLink.style.display = "none";
document.body.appendChild(downloadLink);
downloadLink.click();
}
function destroyClickedElement(event)
{
document.body.removeChild(event.target);
}
function loadFileAsText()
{
var fileToLoad = document.getElementById("fileToLoad1").files[0];
var fileReader = new FileReader();
fileReader.onload = function(fileLoadedEvent)
{
var textFromFileLoaded = fileLoadedEvent.target.result;
document.getElementById("inputTextToSave1").value = textFromFileLoaded;
};
fileReader.readAsText(fileToLoad, "UTF-8");
}
</script>
<table border="2" cellspacing="10" cellpadding="20">
<thead>
<tr>
<!--Zwischen "<th>" kommt die Überschrift der linken Seite, z.B. Du/Sie"</th>"-->
<th><p><left>Datei Bearbeiten</left></p>
<form method="get" action="file:///Users/*****/Desktop/Projekt%20Templates%202.0/index.htm">
<input type="submit" value="Zurueck zur Startseite">
</form>
</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3">
<textarea id="inputTextToSave1" cols="190" rows="25"></textarea>
<br />
<b> Datei zum hochladen auswählen:</b>
<input type="file" id="fileToLoad1">
<button onclick="loadFileAsText()">Load Selected File</button>
<right><b>Dateiname zum Speichern:</b>
<input id="inputFileNameToSaveAs1"></input>
<button onclick="saveTextAsFile()">Datei speichern</button></td>
</tr>
</tbody>
</table>
<br />
</body>
</html>