Adding data to table from local storage - javascript

Good day,
This is some sort of a journal I'm trying to make, the localStorage setItem part is fine, it's the getItem I'm having trouble with, after adding the entries to the table, when I refresh, all of the entries are gone and I'm only left with 1 row with the default input values, ("state?" and "").
JS code:
const state = document.querySelector("#state");
const why = document.querySelector(".why");
const button = document.querySelector(".button");
const table = document.querySelector(".table");
var currentDate = new Date();
let cDay = currentDate.getDate();
let cMonth = currentDate.getMonth() + 1;
let cYear = currentDate.getFullYear();
let cDate = cMonth + "-" + cDay;
var sArray = [];
// Check if there's data in local storage
if (localStorage.getItem("states")) {
sArray = JSON.parse(localStorage.getItem("states"));
}
getDataFromLocalStorage();
button.addEventListener("click", () => {
if (state.value !== "state?") {
addToArray();
why.value = "";
state.value = "state?";
}
});
function addToArray() {
addToTable();
addDataToLocalStorage();
}
function addDataToLocalStorage() {
window.localStorage.setItem("states", JSON.stringify(sArray));
}
function addToTable() {
// Object
let dataObject = {
state: state.value,
reason: why.value,
};
// Add to array
sArray.push(dataObject);
const tr = document.createElement("tr");
const tdstate = document.createElement("td");
const tdWhy = document.createElement("td");
const tdDate = document.createElement("td");
tr.appendChild(tdstate);
tr.appendChild(tdWhy);
tr.appendChild(tdDate);
table.appendChild(tr);
tdstate.innerText = dataObject.state;
tdWhy.innerText = dataObject.reason;
tdDate.innerText = cDate;
}
function getDataFromLocalStorage() {
let data = window.localStorage.getItem("states");
if (data) {
let states = JSON.parse(data);
addToTable(states);
}
}
And this is the HTML code
<body>
<h1>How are you feeling today?</h1>
<div class="content">
<div class="form">
<select name="state" id="state">
<option>State?</option>
<option value="very happy">Very happy</option>
<option value="happy">Happy</option>
<option value="okay">Okay</option>
<option value="sad">Sad</option>
<option value="terrible">Terrible</option>
</select>
<input class="why" type="text" placeholder="Why?" />
<input class="button" type="button" value="Add" />
</div>
<table class="table">
<th>State</th>
<th>Reason</th>
<th>Date</th>
</table>
</div>
<script src="script.js"></script>
</body>

you call addToTable(states); but this function doesn't accept any parameters function addToTable() {.
and it seams like a problem in your logic.
you write it to sArray but never use this values.
here a blind try, not tested it:
const state = document.querySelector("#state");
const why = document.querySelector(".why");
const button = document.querySelector(".button");
const table = document.querySelector(".table");
// Date
var currentDate = new Date();
let cDay = currentDate.getDate();
let cMonth = currentDate.getMonth() + 1;
let cYear = currentDate.getFullYear();
let cDate = cMonth + "-" + cDay;
var sArray = [];
getDataFromLocalStorage();
button.addEventListener("click", () => {
if (state.value !== "state?") {
addToArray({
state: state.value,
reason: why.value,
});
why.value = "";
state.value = "state?";
}
});
function addToArray(dataObject) {
sArray.push(dataObject);
addToTable(dataObject);
addDataToLocalStorage();
}
function addDataToLocalStorage() {
window.localStorage.setItem("states", JSON.stringify(sArray));
}
function addToTable(dataObject) {
const tr = document.createElement("tr");
const tdstate = document.createElement("td");
const tdWhy = document.createElement("td");
const tdDate = document.createElement("td");
tr.appendChild(tdstate);
tr.appendChild(tdWhy);
tr.appendChild(tdDate);
table.appendChild(tr);
tdstate.innerText = dataObject.state;
tdWhy.innerText = dataObject.reason;
tdDate.innerText = cDate;
}
function getDataFromLocalStorage() {
let data = window.localStorage.getItem("states");
if (data) {
sArray = JSON.parse(data);
for(const row of sArray) {
addToTable(row);
}
}
}

There are multiple issues. I would suggest, you should follow the SOLID principle and divide function according to its work. Same time, Instead of creating variables and syncing with storage could be an issue. So directly modifying the localStorage is a good choice.
const stateBtn = document.querySelector("#state");
const whyBtn = document.querySelector(".why");
const addBtn = document.querySelector(".button");
const table = document.querySelector(".table");
// Date
var currentDate = new Date();
let cDay = currentDate.getDate();
let cMonth = currentDate.getMonth() + 1;
let cYear = currentDate.getFullYear();
let cDate = cMonth + "-" + cDay;
addBtn.addEventListener("click", () => {
if (stateBtn.value !== "state?") {
const row = { reason: whyBtn.value, state: stateBtn.value };
addDataToLocalStorage(row);
addToTable(row);
whyBtn.value = "";
stateBtn.value = "state?";
}
});
function addDataToLocalStorage(row) {
const states = [...getDataFromLocalStorage(), row];
localStorage.setItem("states", JSON.stringify(states));
}
function renderTable() {
const states = getDataFromLocalStorage();
for (let row of states) {
addToTable(row);
}
}
function addToTable(row) {
const tr = document.createElement("tr");
const tdstate = document.createElement("td");
const tdWhy = document.createElement("td");
const tdDate = document.createElement("td");
tr.appendChild(tdstate);
tr.appendChild(tdWhy);
tr.appendChild(tdDate);
table.appendChild(tr);
tdstate.innerText = row.state;
tdWhy.innerText = row.reason;
tdDate.innerText = cDate;
}
function getDataFromLocalStorage() {
let data = localStorage.getItem("states") || "[]";
return JSON.parse(data);
}
renderTable();

Related

Javascript To-Do List with IndexedDB shows always the same Date for every Item after adding an Item to the list

I created a To-Do List with Javascript, HTML and IndexedDB to store the Items in the database so that when I refresh the Browser the items won't get deleted. I also want to add the Date to the Items, but when I press the button to add an Item, the Date always becomes the same as the other items, but that's not how it should work:
I want that the date is always as I choose it to be for every Item.
It's the first time i ask a question here, so i hope it's not completely wrong how I do it.
Here is the whole code, i think the problem lays in the renderTodo(row)-function but I am not sure:
<!DOCTYPE html>
<html>
<head>
<title>ToDo-List IndexedDB</title>
<script type="text/javascript">
var html5rocks = {};
window.indexedDB = window.indexedDB || window.webkitIndexedDB ||
window.mozIndexedDB;
if ('webkitIndexedDB' in window)
{
window.IDBTransaction = window.webkitIDBTransaction;
window.IDBKeyRange = window.webkitIDBKeyRange;
}
html5rocks.indexedDB = {};
html5rocks.indexedDB.db = null;
html5rocks.indexedDB.onerror = function(e)
{
console.log(e);
};
html5rocks.indexedDB.open = function()
{
var version = 1;
var request = indexedDB.open("todos", version);
// We can only create Object stores in a versionchange transaction.
request.onupgradeneeded = function(e)
{
var db = e.target.result;
// A versionchange transaction is started automatically.
e.target.transaction.onerror = html5rocks.indexedDB.onerror;
if(db.objectStoreNames.contains("todo"))
{
db.deleteObjectStore("todo");
}
var store = db.createObjectStore("todo",
{keyPath: "timeStamp"});
};
request.onsuccess = function(e)
{
html5rocks.indexedDB.db = e.target.result;
html5rocks.indexedDB.getAllTodoItems();
};
request.onerror = html5rocks.indexedDB.onerror;
};
html5rocks.indexedDB.addTodo = function(todoText)
{
var db = html5rocks.indexedDB.db;
var trans = db.transaction(["todo"], "readwrite");
var store = trans.objectStore("todo");
var data =
{
"text": todoText,
"timeStamp": new Date().getTime()
};
var request = store.put(data);
request.onsuccess = function(e)
{
html5rocks.indexedDB.getAllTodoItems();
};
request.onerror = function(e)
{
console.log("Error Adding: ", e);
};
};
html5rocks.indexedDB.deleteTodo = function(id)
{
var db = html5rocks.indexedDB.db;
var trans = db.transaction(["todo"], "readwrite");
var store = trans.objectStore("todo");
var request = store.delete(id);
request.onsuccess = function(e)
{
html5rocks.indexedDB.getAllTodoItems();
};
request.onerror = function(e)
{
console.log("Error Adding: ", e);
};
};
html5rocks.indexedDB.getAllTodoItems = function()
{
var todos = document.getElementById("list");
todos.innerHTML = "";
var db = html5rocks.indexedDB.db;
var trans = db.transaction(["todo"], "readwrite");
var store = trans.objectStore("todo");
// Get everything in the store;
var keyRange = IDBKeyRange.lowerBound(0);
var cursorRequest = store.openCursor(keyRange);
cursorRequest.onsuccess = function(e)
{
var result = e.target.result;
if(!!result == false)
return;
renderTodo(result.value);
result.continue();
};
cursorRequest.onerror = html5rocks.indexedDB.onerror;
};
function renderTodo(row)
{
const dt = getDatePickerDate('date');
const options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
if(row.text.trim() == "")
{
document.getElementById("ausgabe").innerHTML = "<br/><br/> Have to enter a task!";
}
else
{
document.getElementById("ausgabe").innerHTML = "";
var input_date = " " + dt.toLocaleDateString([], options) + ": " + row.text;
var list = document.getElementById("list");
var container = document.createElement("container");
var button = document.createElement("button");
button.type = "button";
button.innerText = "X";
var a = document.createElement("a");
button.addEventListener("click", function()
{
html5rocks.indexedDB.deleteTodo(row.timeStamp);
}, false);
container.appendChild(document.createElement("br"));
container.appendChild(document.createElement("br"));
container.appendChild(button);
container.appendChild(document.createTextNode(input_date));
container.appendChild(document.createElement("br"));
list.appendChild(container);
}
}
function getDatePickerDate(elementId)
{
const value = document.getElementById(elementId).value
const [year, month, day] = value.split('-');
return new Date(year, month - 1, day);
}
function addTodo()
{
var todo = document.getElementById("todo");
html5rocks.indexedDB.addTodo(todo.value);
todo.value = "";
}
function init()
{
html5rocks.indexedDB.open();
}
window.addEventListener("DOMContentLoaded", init, false);
</script>
</head>
<body style="background-color:#647e7f">
<h1 style="position:absolute;top:10px;left:10px;">ToDo Liste </h1>
<br /><br /><br /> <br /><br /> <br /><br /><h2>Activity:</h2><br /><br />
<textarea id="todo" name="text_input" rows="10" cols="50">
</textarea>
<br />
<input type="date" id="date">
<input type="button" value="add" id = "speichern" onclick="addTodo()" />
<br />
<p id = "ausgabe" ></p>
<container id = "list" ></container>
</body>
</html>
It is because your code is synchronous. Each addTodo happens sequentially and synchronous
To get different dates, Make functions async, await each transaction to database (it will take time)
html5rocks.indexedDB.addTodo = async function(...
...
var request = await store.put(data);

Delay script with setTimeout()

I'm trying to display some data from google - the script below works for pulling the data - but I want to add a delay to it running so there's time for it to process the data when a change is made.
I've tried adding setTimeout() to the whole piece of code, but when I add it it turns back blank.
Any ideas?
https://codepen.io/jameswill77/pen/PoREWmK
const sheetId = '1Fa0SgniGrmW_0DCQriR6-XYj2eiRayTK_9HZG9BQYok';
const base = `https://docs.google.com/spreadsheets/d/${sheetId}/gviz/tq?`;
const sheetName = 'sheet 1';
const query = encodeURIComponent('Select *')
const url = `${base}&sheet=${sheetName}&tq=${query}`
const data = []
document.addEventListener('DOMContentLoaded', init)
const output = document.querySelector('.output')
function init() {
fetch(url)
.then(res => res.text())
.then(rep => {
//Remove additional text and extract only JSON:
const jsonData = JSON.parse(rep.substring(47).slice(0, -2));
console.log(rep)
const colz = [];
const tr = document.createElement('tr');
//Extract column labels
jsonData.table.cols.forEach((heading) => {
if (heading.label) {
let column = heading.label;
colz.push(column);
const th = document.createElement('th');
th.innerText = column;
tr.appendChild(th);
}
})
output.appendChild(tr);
//extract row data:
jsonData.table.rows.forEach((rowData) => {
const row = {};
colz.forEach((ele, ind) => {
row[ele] = (rowData.c[ind] != null) ? rowData.c[ind].v : '';
})
data.push(row);
})
processRows(data);
})
}
function processRows(json) {
json.forEach((row) => {
const tr = document.createElement('tr');
const keys = Object.keys(row);
keys.forEach((key) => {
const td = document.createElement('td');
td.textContent = row[key];
tr.appendChild(td);
})
output.appendChild(tr);
})
}
<div class="output"></div>
document.addEventListener('DOMContentLoaded', () => {
setTimeout(init, 3000);
});
Is this behaviour what you are looking for?

Updating a value in firebase with javascript not working

I have the following function to get and display data from firebase, create buttons to change the value of 'read' from a book
function readBooksSaved() {
firebase.database().ref('books').orderByChild('author').on('value', function(snapshot){
snapshot.forEach(function(childSnapshot) {
var childData = childSnapshot.val();
//alert(childData)
let key = childSnapshot.key
let b_title = childSnapshot.val().title;
let b_author = childSnapshot.val().author;
let b_page = childSnapshot.val().page;
let b_read = childSnapshot.val().read;
const u = document.querySelector('#container-li');
let a = document.createElement('li');
let b = document.createElement('li');
let c = document.createElement('li');
let d = document.createElement('li');
const li = document.createElement('li');
const button = document.createElement('a')
const button2 = document.createElement('a')
a.innerHTML = `<strong>Title:</strong> ${b_title}`;
b.innerHTML = `<strong>Author:</strong> ${b_author}`;
c.innerHTML = `<strong>Pages:</strong> ${b_page}`;
button.innerHTML = `Erase`;
if (b_read) {
b_read = 'Yes'
status = 'Unread'}
else {
b_read = 'No' }
d.innerHTML = `<strong>Read</strong> ${b_read}`;
button2.innerHTML = `<a class="btn btn-primary" id="change">${status}</a>`;
u.appendChild(a).classList.add("bg-info");
u.appendChild(b).classList.add("list-group-item");
u.appendChild(c).classList.add("list-group-item");
u.appendChild(d).classList.add("list-group-item");
u.appendChild(button).classList.add("list-group-item");
u.appendChild(button2).classList.add("list-group-item");
let change_bt = document.querySelector('#change')
change_bt.addEventListener('click', changeReadStatus(key, b_read))
});
});
}
function changeReadStatus(key, b_read){
let db_firebase = firebase.database().ref('books/'+ key)
if (b_read) {
db_firebase.update({'/read': false})
}
else {
db_firebase.update({'/read': true})
}
}
Everytime the page loads it enters to the changeReadStatus function and when click on the button the value or 'read' doesn't change on firebase. ¿Could you help me, please? I think I have some errors on the code but I have try without success.
Try this code:
function changeReadStatus(key, b_read){
let db_firebase = firebase.database().ref('books/'+ key);
if(b_read){
db_firebase.update({
'read': true
});
}
else{
db_firebase.update({
'read': false
});
}
}
You should be using the set() function, like this:
function changeReadStatus(key, b_read){
let db_firebase = firebase.database().ref('books/'+ key);
db_firebase.set({'read': b_read});
}

How to pass constructor values into the DOM

Link to codepen.
I have a form that people fill out. On clicking submit I want the data to be entered onto the page.
The empty log array and then Patient constructor:
// Set patient log to empty array
let myLog = [];
// Create patient constructor
function Patient(
name,
date,
primInsurance,
secInsurance,
estimate,
isItCovered,
followUp
) {
this.name = name;
this.date = date;
this.primInsurance = primInsurance;
this.secInsurance = secInsurance;
this.estimate = estimate;
this.isItCovered = isItCovered;
this.followUp = followUp;
}
When you click submit, it runs this function:
function addPatientToList(e) {
// Grab elements
const nameValue = document.querySelector("#name").value;
const dateValue = document.querySelector("#date").value;
const primInsurValue = document.querySelector("#primary-insurance").value;
const secInsurValue = document.querySelector("#secondary-insurance").value;
const estimateValue = document.querySelector("#estimate").value;
const isItCoveredValue = document.querySelector("#covered").value;
const followUpValue = document.querySelector("#follow-up").value;
e.preventDefault();
// Instantiate patient
const patient = new Patient(
nameValue,
dateValue,
primInsurValue,
secInsurValue,
estimateValue,
isItCoveredValue,
followUpValue
);
myLog.push(patient);
renderPatient();
clearFields();
closeModal();
}
After adding the patient to the constructor, it attempts to render to the dom:
function renderPatient() {
const list = document.querySelector("#patient-list");
const row = document.createElement("tr");
row.innerHTML = `
<td>${Patient.name}</td>
<td>${Patient.date}</td>
<td>${Patient.primInsur}</td>
<td>${Patient.secInsurance}</td>
<td>${Patient.estimate}</td>
<td>${Patient.isItCovered}</td>
<td>${Patient.followUp}</td>`;
list.appendChild(row);
}
What shows up in the dom is just 'undefined' across all table rows.
You're referencing the Patient "class" and not the patient "instance", here's the code fixed.
const submitBtn = document.querySelector("#submit");
// Set patient log to empty array
let myLog = [];
var patient;
// Create patient constructor
function Patient(
name,
date,
primInsurance,
secInsurance,
estimate,
isItCovered,
followUp
) {
this.name = name;
this.date = date;
this.primInsurance = primInsurance;
this.secInsurance = secInsurance;
this.estimate = estimate;
this.isItCovered = isItCovered;
this.followUp = followUp;
}
// On click, submit patients to log and clear fields
submitBtn.addEventListener("click", addPatientToList);
function addPatientToList(e) {
// Grab elements
const nameValue = document.querySelector("#name").value;
const dateValue = document.querySelector("#date").value;
const primInsurValue = document.querySelector("#primary-insurance").value;
const secInsurValue = document.querySelector("#secondary-insurance").value;
const estimateValue = document.querySelector("#estimate").value;
const isItCoveredValue = document.querySelector("#covered").value;
const followUpValue = document.querySelector("#follow-up").value;
e.preventDefault();
// Instantiate patient
patient = new Patient(
nameValue,
dateValue,
primInsurValue,
secInsurValue,
estimateValue,
isItCoveredValue,
followUpValue
);
myLog.push(patient);
renderPatient();
clearFields();
closeModal();
console.log(myLog);
}
// Render patient to list
function renderPatient() {
const list = document.querySelector("#patient-list");
const row = document.createElement("tr");
row.innerHTML = `
<td>${patient.name}</td>
<td>${patient.date}</td>
<td>${patient.primInsur}</td>
<td>${patient.secInsurance}</td>
<td>${patient.estimate}</td>
<td>${patient.isItCovered}</td>
<td>${patient.followUp}</td>`;
list.appendChild(row);
}
// Close modal
function closeModal() {
modal.style.display = "none";
}
// Clear fields
function clearFields() {
nameValue = "";
dateValue = "";
primInsurValue = "";
secInsurValue = "";
estimateValue = "";
isItCoveredValue = "";
followUpValue = "";
}
///// Show / hide modal
// Grab the modal / button
const modal = document.querySelector("#modal");
const addBtn = document.querySelector("#add");
const closeBtn = document.getElementsByClassName("close")[0];
// When the user clicks on the button, open the modal
addBtn.addEventListener("click", function () {
modal.style.display = "block";
});
// When the user clicks on <span> (x), close the modal
closeBtn.addEventListener("click", function () {
modal.style.display = "none";
});
// Anywhere outside, close modal
window.addEventListener("click", function () {
if (event.target == modal) {
modal.style.display = "none";
}
});
You're not accessing anything when you call Patient.property. You could just pass the patient object to renderPatient.
function addPatientToList(e) {
// Grab elements
const nameValue = document.querySelector("#name").value;
const dateValue = document.querySelector("#date").value;
const primInsurValue = document.querySelector("#primary-insurance").value;
const secInsurValue = document.querySelector("#secondary-insurance").value;
const estimateValue = document.querySelector("#estimate").value;
const isItCoveredValue = document.querySelector("#covered").value;
const followUpValue = document.querySelector("#follow-up").value;
e.preventDefault();
// Instantiate patient
const patient = new Patient(
nameValue,
dateValue,
primInsurValue,
secInsurValue,
estimateValue,
isItCoveredValue,
followUpValue
);
myLog.push(patient);
renderPatient(patient);
clearFields();
closeModal();
console.log(myLog);
}
// Render patient to list
function renderPatient(patient) {
const list = document.querySelector("#patient-list");
const row = document.createElement("tr");
row.innerHTML = `
<td>${patient.name}</td>
<td>${patient.date}</td>
<td>${patient.primInsurance}</td>
<td>${patient.secInsurance}</td>
<td>${patient.estimate}</td>
<td>${patient.isItCovered}</td>
<td>${patient.followUp}</td>`;
list.appendChild(row);
}
The problem is those properties aren't static properties of the Patient class, they are only available from the instance of Patient. You can access them via:
// Instantiate patient
const patient = new Patient(
nameValue,
dateValue,
primInsurValue,
secInsurValue,
estimateValue,
isItCoveredValue,
followUpValue
);
console.log(patient.nameValue); // outputs patient name from modal

Prevent duplicate E-mail Google Spreadsheets script

i'm currently able to send E-mail with Google Spreadsheets script. But my trigger and if condition didn't prevent E-mail sending as i wish :
Here is my code :
'''
function myFunction() {
const ss = SpreadsheetApp.getActiveSpreadsheet();
const ws = ss.getSheetByName("MASTER");
const h3 = 'SPP Proyek JIS Tanggal xx dari xxx';
const headers = ws.getRange("A2:M2").getValues();
const item = headers[0][4];
const spec = headers[0][5];
const sat = headers[0][6];
const qty = headers[0][7];
const price = headers[0][8];
const total = headers[0][9];
const tujuan = headers[0][10];
const lr = ws.getLastRow();
const tableRangeValues = ws.getRange(3, 5,lr-2,7).getDisplayValues();
const trigger = ws.getRange(3, 1,lr-2).getValues();
const statusEmail = ws.getRange(3, 13,lr-2).getValues();
const htmlTemplate = HtmlService.createTemplateFromFile("Email");
htmlTemplate.h3 = h3;
htmlTemplate.headers = headers;
htmlTemplate.item = item;
htmlTemplate.spec = spec;
htmlTemplate.sat = sat;
htmlTemplate.qty = qty;
htmlTemplate.price = price;
htmlTemplate.total = total;
htmlTemplate.tujuan = tujuan;
htmlTemplate.tableRangeValues = tableRangeValues;
htmlTemplate.trigger = trigger;
htmlTemplate.statusEmail = statusEmail;
const htmlForEmail = htmlTemplate.evaluate().getContent();
if ((trigger != 'FALSE') && (statusEmail != 'EMAIL_SENT')); {
GmailApp.sendEmail(
"sistem.jis#gmail.com",
"Approval SPP Komersial",
"HTML Support",
{ htmlBody: htmlForEmail }
);
ws.getRange(3, 13,lr-2).setValue('EMAIL_SENT');
}
'''
and this is my sample file link :
https://docs.google.com/spreadsheets/d/13TKIhY7HmK3o-j98q45XXb2nwZzfYwyYn7EULhY_RJw/edit#gid=1216091331
it seems i have problem with the trigger and if condition code which i don't understand
Thank you!
Defining const trigger = ws.getRange(3, 1,lr-2).getValues(); returns you an array of type [[FALSE], [true], [FALSE], [true]]
To make your code work you need to define a loop that iterates through each row (and trigger) invidually
Also, remove the ; from if ((trigger != 'FALSE') && (statusEmail != 'EMAIL_SENT')); {
Sample:
function myFunction() {
const ss = SpreadsheetApp.getActiveSpreadsheet();
const ws = ss.getSheetByName("MASTER");
const h3 = 'SPP Proyek JIS Tanggal xx dari xxx';
const headers = ws.getRange("A2:M2").getValues();
const item = headers[0][4];
const spec = headers[0][5];
const sat = headers[0][6];
const qty = headers[0][7];
const price = headers[0][8];
const total = headers[0][9];
const tujuan = headers[0][10];
const lr = ws.getLastRow();
const tableRangeValues = ws.getRange(3, 5,lr-2,7).getDisplayValues();
var data = ws.getRange(3, 1,lr-2,13).getDisplayValues();
for (var i = 0; i < data.length; i++){
const trigger = data[i][0];
const statusEmail = data[i][12];
const htmlTemplate = HtmlService.createTemplateFromFile("Email");
htmlTemplate.h3 = h3;
htmlTemplate.headers = headers;
htmlTemplate.item = item;
htmlTemplate.spec = spec;
htmlTemplate.sat = sat;
htmlTemplate.qty = qty;
htmlTemplate.price = price;
htmlTemplate.total = total;
htmlTemplate.tujuan = tujuan;
htmlTemplate.tableRangeValues = tableRangeValues;
htmlTemplate.trigger = trigger;
htmlTemplate.statusEmail = statusEmail;
const htmlForEmail = htmlTemplate.evaluate().getContent();
Logger.log(trigger);
if ((trigger != 'FALSE') && (statusEmail != 'EMAIL_SENT')) {
GmailApp.sendEmail(
"sistem.jis#gmail.com",
"Approval SPP Komersial",
"HTML Support",
{ htmlBody: htmlForEmail }
);
ws.getRange(3, 13,lr-2).setValue('EMAIL_SENT');
}
}
}
Note:
In this sample I did not modify tableRangeValues since those values are processed later on on your client-side. Depending on what you want them to be like, you might also want to iterate throguh tem.

Categories

Resources