I have two HTML pages, one in which a file is uploaded and another in which the file is read.
Here is the page where it is uploaded:
<html>
<head>
<script>
function set_file() {
if (typeof(Storage) !== 'undefined') {
localStorage.file_input = document.getElementById("file_input").files[0];
}
</script>
</head>
<body>
<form action='pagetwo.html'>
File: <input type="file" id="file_input">
<input type="submit" value="run" onclick="set_file()">
</form>
</body>
</html>
Here is the file in which it is read:
<html>
<head>
</head>
<body>
<script>
let reader = new FileReader();
reader.readAsText(localStorage.file_input); // This causes the error
</script>
</body>
</html>
When I run this, I get the error "Argument 1 of FileReader.readAsText is not an object". Does anyone know why this is?
Related
I have a problem where my script in HTML page can't call a function outside the HTML file or a function through the library. Here is the HTML code:
`<!DOCTYPE html>
<html>
<head>
<base target="_top">
<?!= include('Stylesheet'); ?>
</head>
<body>
<h1>Welcome</h1>
<p>Please enjoy this helpful script.</p>
<?!= include('JavaScript'); ?>
<div>
<label for="sheetLink">Google Sheets Link:</label>
<input type="text" id="myInput">
<button id="myButton" onclick="handleButtonClick()">Click me</button>
</div>
<script>
function handleButtonClick() {
var userInput = document.getElementById("myInput").value;
console.log(userInput);
alert(userInput)
let uwow = LibIdentifier.receiveLink();
Logger.log(uwow);
console.log(uwow);
alert(uwow)
userClicked();
}
</script>
</body>
</html>`
I Expect the code to receive variable uwow from another function, and then do alert from result.
I have tried using google.script.run.functionname(). But it does not work.
What actually resulted is an error like this:
Error on Click
I what to load the b.js file to HTML with button and function. when user type "yes" and click on "Ok" button, "b.js" must load in page (not open in new window or new tab)
what code I must to use in ??????????? place to solve my problem?
here is the code:
HOME.html
<html>
<head>
</head>
<body>
<form name="load">yes OR no<input name="id" type="text">
<input type="button" value="OK" onClick="my(document.forms.load)">
<script>
function my(form) {
if (form.id.value=="yes") {
?????????????
} else {
alert("NO")
}
}
</script>
</body>
</html>
b.js
document.write(`
<html>
<h1> Load the HTML code</h1>
</html>
`);
I tried to use <script src="b.js"></script> but this code immediately load "b.js" that I dont what this
I tried to use
var scriptTag = document.createElement('script');
scriptTag.setAttribute('src','b.js');
document.head.appendChild(scriptTag)
but not working
I tried to use
document.getElementsByTagName('body')[0].innerHTML += "<script src='b.js'></script>";
but this code not working
what can I do to load the "b.js" file after click on button?
thanks :)
Is this what you're looking gor?
function my(form) {
const loadHTML = () => {
const scriptB = document.createElement('script')
scriptB.setAttribute('src','b.js')
console.log(scriptB)
document.write(`
<h1>Load the HTML code</h1>
${scriptB.outerHTML}
`);
}
if (form.id.value==="yes") {
loadHTML()
} else {
alert("NO")
}
}
<html>
<head>
</head>
<body>
<form name="load">
<h2>YES or NO</h2>
<input name="id" type="text">
<input type="button" value="OK" onClick="my(document.forms.load)">
</form>
</body>
</html>
I have created a basic file upload form with google script. Im wondering if someone can help me add a progress bar or some sort upload percentage indiation so that users dont navigate from the form before upload is complete.
Here is the Google script: Code.gs
function doGet() {
var html = HtmlService.createHtmlOutputFromFile('index');
return html;
}
function uploadFiles(data)
{
var file = data.myFile;
var folder = DriveApp.getFolderById('XXXXXXXXXXXXXXXXXXXXXXXX');
var createFile = folder.createFile(file);
}
Here is the form code: index.html
<!DOCTYPE html>
<html>
<head>
<base target="_top">
<title>Upload Files</title>
</head>
<body>
<h1>File Uploader</h1>
<form>
<input type="file" name="myFile" multiple>
<br>
<br>
<input type="button" id="submitBtn" value="Upload Files">
<label id="resp"></label>
</form>
<script>
document.getElementById('submitBtn').addEventListener('click',
function(e){
google.script.run.withSuccessHandler(onSuccess).uploadFiles(this.parentNode)
})
function onSuccess(data){
document.getElementById('resp').innerHTML = "File Uploaded Successfully!";
}
</script>
</body>
</html>
Hi everyone i'm trying to use Jquery and Modernizr to select 1 .txt file from my pc
I have the next code on my project:
<!DOCTYPE html>
<html>
<head>
<title>Read file on HTML5</title>
<meta charset="UTF-8">
<script src="jquery-3.5.1.min.js" type="text/javascript"></script>
<script src="modernizr.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
if (Modernizr.draganddrop && window.FileList) {
} else {
alert("Your browser doesn't support API or Drag&Drop");
}
;
$('#file').change(filedriver);
function filedriver(event) {
var file = event.target.files[0];
if(file.type !== "text/plain"){
alert("File .txt must be select");
return;
}
var reader = new FileReader();
reader.onload = function(event){
var textResult = event.target.result;
$('content').append(textResult);
};
reader.readAsText(file);
}
});
</script>
</head>
<body>
<h1>Read file on HTML5</h1>
<form>
<label>Select file </label>
<input type="file" name="file" id="file" />
<p>Content on file</p>
<textarea cols="100" rows="15" id="content"></textarea>
</form>
</body>
</html>
When i execute the proyect on my browser the validation for the file works, but the reader doesn't return the content on the file.
¿where it's my error?
https://www.dropbox.com/s/sxrvou2spfdjgte/LecturaArchivoTexto.rar?dl=0
enter image description here
I have the following code that works:
<html>
<head>
<script>
function loaded(){
oFormElement = document.forms['test form'].elements["txtStatus"];
oFormElement.value = "just loaded";
}
</script>
</head>
<body onload="loaded()">
<p>my first socket.io test</p>
<form id = "test form">
<input type="text" id ="txtStatus" value="">
</form>
</body>
</html>
now, if I include the reference to socket.io, it stops working
<html>
<head>
<script src="socket.io/socket.io.js">
<script>
function loaded(){
is this because socket.io handles from elements in it's own way, or is because the browser cannot find socket.io ? Is there any way to debug this/fix this ?
You need to close the first <script> tag...
<html>
<head>
<script src="socket.io/socket.io.js"></script>
<script>
function loaded(){
// ...