Hi Community,
i am momently working on a short template tool. It should works like visiting the index with the drope down menu -> view the Template -> if necessary edit the Template & save it on same Path.
The Index and viewer works. As well i got it to load the file, edit it & save it. But everything i try to get it downloaded automaticly to the same folder as the file got uploaded i receive errors. I need always to select manually the Path where the file should be saved.
Does anybody knows how to include a file path that the file get saved on the same path as uploaded?
[CODE lang="html" highlight="28-36"]<!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>
<th><p><left>Datei Bearbeiten</left></p>
<form method="get" action="file:///Users/*****/Desktop/Projekt%20Templates%202.0/index.htm">
<input type="submit" value="Back to Index">
</form>
</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3">
<textarea id="inputTextToSave1" cols="190" rows="25"></textarea>
<br />
<b> File to Upload</b>
<input type="file" id="fileToLoad1">
<button onclick="loadFileAsText()">Load Selected File</button>
<right><b>name of file to save:</b>
<input id="inputFileNameToSaveAs1"></input>
<button onclick="saveTextAsFile()">save file</button></td>
</tr>
</tbody>
</table>
<br />
</body>
</html>[/CODE]
i am momently working on a short template tool. It should works like visiting the index with the drope down menu -> view the Template -> if necessary edit the Template & save it on same Path.
The Index and viewer works. As well i got it to load the file, edit it & save it. But everything i try to get it downloaded automaticly to the same folder as the file got uploaded i receive errors. I need always to select manually the Path where the file should be saved.
Does anybody knows how to include a file path that the file get saved on the same path as uploaded?
[CODE lang="html" highlight="28-36"]<!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>
<th><p><left>Datei Bearbeiten</left></p>
<form method="get" action="file:///Users/*****/Desktop/Projekt%20Templates%202.0/index.htm">
<input type="submit" value="Back to Index">
</form>
</th>
</tr>
</thead>
<tbody>
<tr>
<td colspan="3">
<textarea id="inputTextToSave1" cols="190" rows="25"></textarea>
<br />
<b> File to Upload</b>
<input type="file" id="fileToLoad1">
<button onclick="loadFileAsText()">Load Selected File</button>
<right><b>name of file to save:</b>
<input id="inputFileNameToSaveAs1"></input>
<button onclick="saveTextAsFile()">save file</button></td>
</tr>
</tbody>
</table>
<br />
</body>
</html>[/CODE]
