Contenu d'un textarea
inico.e2i
Messages postés
4
Date d'inscription
Statut
Membre
Dernière intervention
-
inico.e2i Messages postés 4 Date d'inscription Statut Membre Dernière intervention -
inico.e2i Messages postés 4 Date d'inscription Statut Membre Dernière intervention -
Slt à tous!
J'ai une petite application web ayant un textarea: lorsque je clique sur un bouton d'enregistrement, le contenu du textarea est enregistré directement dans le dossier de téléchargement sous forme d'un fichier(voici le code correspondant):
<html>
<head><title>snook.ca load document</title>
<style>
#exampleTextarea { display: block; width: 99%; }
#exampleInputFile { display: none; }
</style>
</head>
<body>
<button type="button" id="btnOpen">Open...</button>
<button type="button" id="btnSave">Save</button>
<textarea id="exampleTextarea" rows=""></textarea>
<input type="file" id="exampleInputFile" accept=".tex,.txt,.csv,.xml">
<script language="JavaScript">
document.getElementById('btnOpen').onclick = function() {
if ('FileReader' in window) {
document.getElementById('exampleInputFile').click();
} else {
alert('Your browser does not support the HTML5 FileReader.');
}
};
document.getElementById('exampleInputFile').onchange = function(event) {
var fileToLoad = event.target.files[0];
if (fileToLoad) {
var reader = new FileReader();
reader.onload = function(fileLoadedEvent) {
var textFromFileLoaded = fileLoadedEvent.target.result;
document.getElementById('exampleTextarea').value = textFromFileLoaded;
};
reader.readAsText(fileToLoad, 'UTF-8');
}
};
document.getElementById('btnSave').onclick = function() {
if ('Blob' in window) {
var fileName = prompt('Please enter file name to save', 'Untitled.txt');
if (fileName) {
var textToWrite = document.getElementById('exampleTextarea').value.replace(/\n/g, '\r\n');
var textFileAsBlob = new Blob([textToWrite], { type: 'text/plain' });
if ('msSaveOrOpenBlob' in navigator) {
navigator.msSaveOrOpenBlob(textFileAsBlob, fileName);
} else {
var downloadLink = document.createElement('a');
downloadLink.download = fileName;
downloadLink.innerHTML = 'Download File';
if ('webkitURL' in window) {
// Chrome allows the link to be clicked without actually adding it to the DOM.
downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
} else {
// Firefox requires the link to be added to the DOM before it can be clicked.
downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
downloadLink.onclick = destroyClickedElement;
downloadLink.style.display = 'none';
document.body.appendChild(downloadLink);
}
downloadLink.click();
}
}
} else {
alert('Your browser does not support the HTML5 Blob.');
}
};
function destroyClickedElement(event) {
document.body.removeChild(event.target);
}
</script>
</body>
</html>
Moi ce que je veux c'est que: lorsque je clique sur le bouton d'enregistrement, une fenêtre s'ouvre et permet à l'utilisateur de choisir l'emplacement du fichier dans son disque dur.
Cordialement,
J'ai une petite application web ayant un textarea: lorsque je clique sur un bouton d'enregistrement, le contenu du textarea est enregistré directement dans le dossier de téléchargement sous forme d'un fichier(voici le code correspondant):
<html>
<head><title>snook.ca load document</title>
<style>
#exampleTextarea { display: block; width: 99%; }
#exampleInputFile { display: none; }
</style>
</head>
<body>
<button type="button" id="btnOpen">Open...</button>
<button type="button" id="btnSave">Save</button>
<textarea id="exampleTextarea" rows=""></textarea>
<input type="file" id="exampleInputFile" accept=".tex,.txt,.csv,.xml">
<script language="JavaScript">
document.getElementById('btnOpen').onclick = function() {
if ('FileReader' in window) {
document.getElementById('exampleInputFile').click();
} else {
alert('Your browser does not support the HTML5 FileReader.');
}
};
document.getElementById('exampleInputFile').onchange = function(event) {
var fileToLoad = event.target.files[0];
if (fileToLoad) {
var reader = new FileReader();
reader.onload = function(fileLoadedEvent) {
var textFromFileLoaded = fileLoadedEvent.target.result;
document.getElementById('exampleTextarea').value = textFromFileLoaded;
};
reader.readAsText(fileToLoad, 'UTF-8');
}
};
document.getElementById('btnSave').onclick = function() {
if ('Blob' in window) {
var fileName = prompt('Please enter file name to save', 'Untitled.txt');
if (fileName) {
var textToWrite = document.getElementById('exampleTextarea').value.replace(/\n/g, '\r\n');
var textFileAsBlob = new Blob([textToWrite], { type: 'text/plain' });
if ('msSaveOrOpenBlob' in navigator) {
navigator.msSaveOrOpenBlob(textFileAsBlob, fileName);
} else {
var downloadLink = document.createElement('a');
downloadLink.download = fileName;
downloadLink.innerHTML = 'Download File';
if ('webkitURL' in window) {
// Chrome allows the link to be clicked without actually adding it to the DOM.
downloadLink.href = window.webkitURL.createObjectURL(textFileAsBlob);
} else {
// Firefox requires the link to be added to the DOM before it can be clicked.
downloadLink.href = window.URL.createObjectURL(textFileAsBlob);
downloadLink.onclick = destroyClickedElement;
downloadLink.style.display = 'none';
document.body.appendChild(downloadLink);
}
downloadLink.click();
}
}
} else {
alert('Your browser does not support the HTML5 Blob.');
}
};
function destroyClickedElement(event) {
document.body.removeChild(event.target);
}
</script>
</body>
</html>
Moi ce que je veux c'est que: lorsque je clique sur le bouton d'enregistrement, une fenêtre s'ouvre et permet à l'utilisateur de choisir l'emplacement du fichier dans son disque dur.
Cordialement,
A voir également:
- Contenu d'un textarea
- Word a trouvé du contenu illisible - Guide
- Le fichier à télécharger correspond au contenu brut d’un courrier électronique. de quel pays a été envoyé ce message ? - Guide
- Fusionner deux cellules excel en gardant le contenu - Guide
- Contenu sme - Forum YouTube
- [<B>contenu masqué</b>] - Forum Téléphones & tablettes Android
2 réponses
Salut,
vous pouvez utiliser php pour ça(avec les formulaire de fichiers) ou simplement l'attribut download de HTML5:
http://www.w3schools.com/tags/att_a_download.asp
Une base de données est certainement mieux pour ce genre de tâche qu'un simple fichier crée par javascript.
vous pouvez utiliser php pour ça(avec les formulaire de fichiers) ou simplement l'attribut download de HTML5:
http://www.w3schools.com/tags/att_a_download.asp
Une base de données est certainement mieux pour ce genre de tâche qu'un simple fichier crée par javascript.