Electron HTML Javascript button not working
Question
I'm trying to create and save files using javascript.
This is my HTML code:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tutorial</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.con/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" href="./css/styles.css">
</head>
<body>
<div class="container" id="form-container">
<textarea class= "form-control" placeholder ="File Contents..." rows="10"></textarea>
<input id= "content" class="form-control" placeholder="Input Text Here...">
<button id="createButton" class="btn btn-success">Create File</button>
</div>
</body>
<script>
require('./renderer.js')
</script>
</html>
The page looks like this currently. For some reason I don't understand, the button to create file doesn't work I click it but nothing happens. It does not create a file, nor does it open a location where you want to save the file.
This is my Javascript code:
var app = require('electron').remote;
var dialog = app.dialog;
var fs = require('fs');
document.getElementbyId('createButton').onclick = () => {
dialog.showSaveDialog((fileName) => {
if(fileName === undefined){
alert("You didnt save the file");
return;
}
var content = document.getElementbyId('content').value;
fs.writeFile(FileName, content, (err) => {
if(err) console.log(err);
alert("The file has been succesfully saved")
})
});
};
Why won't the 'Create File' button work?
1 answers
solution1
0 2018-02-16 17:12:47
The function you are trying to use is called document.getElementById , using the camel-case naming convention. Your code would look like this, when corrected:
//... require statements as in your code
document.getElementById("createButton").onclick = () => {
// ...
var content = document.getElementById("content").value;
// ...
}
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.