Google Sheet custom HTML prompt doesn't run my gs script - javascript

Tried to run a script from an html message box. But the script doesn't run at all. The code is below:
CreateNewEmployeeSheet.gs
function show_form() {
var ss=SpreadsheetApp.getActive();
var sh=ss.getActiveSheet();
var html = HtmlService.createHtmlOutputFromFile("form.html")
.setWidth(300)
.setHeight(200);
var ui=HtmlService.createHtmlOutput(html);
SpreadsheetApp.getUi().showModelessDialog(ui, 'Neue Mitarbeiter hinzufügen');
}
function resulT(){
var ss=SpreadsheetApp.getActive();
ss.getRange("H3").setValue("OK");
}
form.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="https://ssl.gstatic.com/docs/script/css/add-ons1.css">
</head>
<title>Document</title>
</head>
<body>
<div>
<p>Select a maintenance drone:</p>
<div>
<input type="radio" id="fristarbeiter" name="drone" value="fristarbeiter"
checked>
<label for="huey">Fristarbeiter</label>
</div>
<div>
<input type="radio" id="feststelle" name="drone" value="feststelle">
<label for="dewey">Feststelle</label>
</div>
<br>
<input type="button" value="Submit" class="action" onclick="form_data()" >
<input type="button" value="Close" onclick="google.script.host.close()" />
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script>
function form_data(){
google.script.run.withSuccessHandler(response => {
// do something with the response here to indicate success
}).withFailureHandler(error => {
console.error("appendData() ERROR: " + error.message);
alert("appendData() ERROR: " + error.message);
}).resulT();
var values = [{
"fristarbeiter":$("input[name=fristarbeiter]:checked").val(),
}];
closeIt()
};
function closeIt(){
google.script.host.close()
};
</script>
</body>
</html>
The "debug" output is:
Ho {message: "There was an error during the transport or process…this request. Error code = 10, Path = /wardeninit", name: "TransportError", stack: "TransportError: There was an error during the tran…/js/4186432569-warden_bin_i18n_warden.js:195:263)"}
Is there a problem with access allowance?

Change this part of your code and retry again, should be working now
From:
var html = HtmlService.createHtmlOutputFromFile("form.html")
.setWidth(300)
.setHeight(200);
var ui=HtmlService.createHtmlOutput(html);
SpreadsheetApp.getUi().showModelessDialog(ui, 'Neue Mitarbeiter hinzufügen');
To:
var html = HtmlService.createTemplateFromFile('form')
var ui=html.evaluate().setWidth(300) .setHeight(200);
SpreadsheetApp.getUi().showModelessDialog(ui, 'Neue Mitarbeiter hinzufügen');

Related

How can I change the display a message depending on which number the user has selected?

I want when somebody input a number lower than 4.2, my app shows message as result, but i can't make it happen.
I already tried with return.
JS code
let resultEl = document.getElementById("results")
let numberEl = document.getElementById("number__select")
let message = "mAs: 0.5 y kV: 1.0"
function calculate() {
if (numberEl <= 4.2) {
resultEl.textContent = message;
} else {
resultEl.textContent = "error"
}
}
HTML code
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" href="styleRx.css"/>
<script src="Rxappjs.js"></script>
<title>HVDN Rx app</title>
</head>
<body>
<div class="container">
<header>
<h1>Valoraciones de Rx</h1>
</header>
<div class="box">
<form action="">
<div class="values">
<label for="peso" id="peso__label">Peso</label>
<input class="text__input" type="number" step="0.1" id="number__select" placeholder="Peso"
min="0" required>
</div>
<button id="calcular" onclick="calculate()">Calcular</button>
</form>
<p id="results"></p>
</div>
</div>
</body>
</html>
You have the variable numberEl set to an html element and therefor it will never be less than or equal too 4.2. Try to get the value of that element instead:
let resultEl = document.getElementById("results")
let numberEl = document.getElementById("number__select")
let message = "mAs: 0.5 y kV: 1.0"
function calculate() {
if (numberEl.value <= 4.2) {
resultEl.textContent = message;
} else {
resultEl.textContent = "error"
}
}

How should I make input permanent and make the input stay even after reloading the page in html? [duplicate]

This question already has answers here:
Persist variables between page loads
(4 answers)
Closed 1 year ago.
How should I make input permanent? Like for example, if I type in "Hello world" it should say "hello world " and "hello world" should be there even after reloading
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p id="content"></p>
<input type="text" id="userInput">
<script>
function getInputFromTextBox() {
let input = document.getElementById("userInput").value;
document.getElementById("content").innerHTML = input;
}
</script>
<button onclick="getInputFromTextBox()">submit</button>
</body>
</html>
You can use localStorage
// JAVASCRIPT
// Getting the value from localStorage
// The "key" here need to be the same defined below on the save() function
const getValue = localStorage.getItem("key");
if (getValue) {
document.getElementById("inputId").value = getValue;
}
function save() {
const setValue = document.getElementById("inputId").value;
// Here you can set 'key' with any name you like
// Setting the value in localStorage
localStorage.setItem("key", setValue);
}
<!-- HTML -->
<input type="text" id="inputId" />
<button onclick="save()">save value</button>
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<h3>Type here</h3>
<input type="text" id="inputText">
<input type="submit" id="submit">
<p id="seeHere"></p>
</body>
<script>
if(localStorage.getItem("info")==null){
}
else{
value();
}
let submit = document.getElementById("submit");
submit.addEventListener("click", function () {
console.log("hello world");
let inputText = document.getElementById("inputText");
let inputTextvalue = inputText.value;
inputText.value="";
let localValue = localStorage.getItem("info");
if (localValue == null) {
arr = [];
}
else {
arr = JSON.parse(localValue);
}
arr.push(inputTextvalue);
localStorage.setItem("info", JSON.stringify(arr));
value();
})
function value() {
let localValue = localStorage.getItem("info");
let seeHere = document.getElementById("seeHere");
seeHere.innerHTML="";
let seeHeretext="";
let parsedLocalvalue= JSON.parse(localValue);
parsedLocalvalue.forEach(element => {
seeHeretext=seeHeretext+`${element}<br>`;
});
seeHere.innerHTML=seeHeretext;
}
</script>
</html>
This is the required answer for the question see carefully .

What is problem in my code I am trying to retrive data from firebase database using javascript

What is the problem in my code I am trying to retrieve data from the firebase database using javascript? But not retrieving any data but when I save any data that time it saves successfully in dayabse.
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="form_container">
<input placeholder="Enter Number Of Users Present" type="number" id="number"/>
</div>
<div id="form_container1">
<input placeholder="Enter Todays Date" type="date" id="todaydate"/>
</div>
<div id="button_container">
<button id="savedata" onclick="save()"> Save </button>
</div>
<div id="button_container3">
<button id="read" onclick="get()"> Read </button>
</div>
</body>
</html>
index.js
function save()
{
var data = document.getElementById('number').value
var date = document.getElementById('todaydate').value
database.ref('users/' + date).set({
data : data,
date : date
})
alert('Saved')
}
function get() {
var username = document.getElementById('todaydate').value
var user_ref = database.ref('users/' + date)
user_ref.on('value', function(snapshot) {
var data = snapshot.val()
document.getElementById('number').value = snapshot.val().data;
})
}
My database main file name is users and the subfile name is data. Can anyone please tell me what is problem with my code??

Script keeps on saving the value even when unchecked

I want the script to save the value of the text only when it's checked.
If possible I also want to save the value of it only when it's clicked as a variable so I can do this for example
Name: {here the variable} #if checked
<html>
<head>
<title>Feedback</title>
<script language="Javascript" >
function download(filename, text) {
var pom = document.createElement('a');
pom.setAttribute('href', 'data:text/plain;charset=utf-8,' +
encodeURIComponent(text));
pom.setAttribute('download', filename);
pom.style.display = 'none';
document.body.appendChild(pom);
pom.click();
document.body.removeChild(pom);
}
function addTextHTML()
{
document.addtext.name.value = document.addtext.name.value + ".html"
}
function addTextTXT()
{
document.addtext.name.value = document.addtext.name.value + ".txt"
}
</script>
</head>
<body>
<form name="addtext" onsubmit="download(this['name'].value, this['text'].value)">
<input type="checkbox" name="text" id="test" value=name>
<label for="test">Test</label>
<br>
<input type="text" name="name" value="" placeholder="File Name">
<input type="submit" onClick="addTextHTML();" value="Save As HTML">
<input type="submit" onClick="addTexttxt();" value="Save As TXT">
</form>
</body>
</html>
Try to use break;. But it will give error and you'll be able to see it on console.
So try something like this;
var text = "";
var a;
for (a = 1; a < 2; a++){
//code will be here which gets in the loop
text += "Working";
}
document.getElementById("demo").innerHTML = text;
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width = device-width, initial-scale = 1.0">
<meta http-equiv="X-UA-Compatible" content = "ie=edge">
<title> Keat </title>
</head>
<body>
<p id="demo"></p>
</body>
</html>
This will make loop to but it will restrict the loop.

Displaying form data to new tab

I want display the form data to new tab using JavaScript only. This is not proceeding my task. How to achieve this?
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<script language="JavaScript">
function showInput() {
var message_entered = document.getElementById("user_input").value;
document.getElementById('display').innerHTML = message_entered;
}
</script>
</head>
<body>
<form>
<label><b>Enter a Message</b></label>
<input type="text" name="message" id="user_input">
</form>
<input type="submit" onclick="showInput();"><br />
<label>Your input: </label>
<p><span id='display'></span> </p>
</body>
</html>
var data = "<p>This is new tab'</p><br/>"+message_entered;
newWindow = window.open("data:text/html," + encodeURIComponent(data),
"_blank", "width=200,height=100");
newWindow.focus();
DEMO

Categories

Resources