How to email content from local storage using javascript?
Question
I'm working on a chrome extension that will take input into the text area html form, and display it using a save button below into the myLeads array.
I am stuck on trying to build in an email button/function to take the value from the myLeads array and send that content in an email. My code I have thus far is below, it pulls up the user's desired email and pre-populates the example-email as the recipient.
I would like this to instead populate the value from the myLeads array, as well as the user's email address (or none at all and allow them to input this). I would appreciate any assistance thank you all in advance.
let myLeads = [] const inputEl = document.getElementById("input-el") const inputBtn = document.getElementById("input-btn") const ulEl = document.getElementById("ul-el") const deleteBtn = document.getElementById("delete-btn") const leadsFromLocalStorage = JSON.parse(localStorage.getItem("myLeads")) const tabBtn = document.getElementById("tab-btn") console.log(leadsFromLocalStorage) if (leadsFromLocalStorage) { myLeads = leadsFromLocalStorage render(myLeads) } else { console.log("No local storage data") } inputBtn.addEventListener("click", function() { myLeads.push(inputEl.value) inputEl.value = "" localStorage.setItem("myLeads", JSON.stringify(myLeads) ) render(myLeads) }) deleteBtn.addEventListener("dblclick", function(){ myLeads = []; localStorage.clear(); render(myLeads); }) function render(leads) { let listItems = "" for (let i = 0; i < leads.length; i++) { listItems += ` <li> ${leads[i]} </li> ` } ulEl.innerHTML = listItems } const emailBtn = document.getElementById("email-btn") emailBtn.addEventListener("dblclick", function() { const sendMail = () => { const link = "mailto:example-email.com" + "&subject=" + encodeURIComponent("This is my subject") + "&body=" + encodeURIComponent(myLeads.value); window.location.href = link; }; sendMail(); })
<html> <head> <link rel="stylesheet" href="index.css"> </head> <body> <textarea cols="40" rows="5" id="input-el"> </textarea> <button id="input-btn">SAVE INPUT</button> <button id="delete-btn">DELETE ALL</button> <button id="email-btn">EMAIL LEADS</button> <ol id="ul-el"> </ol> <script src="index.js"></script> </body> </html>
1 answers
solution1
0 2022-07-24 03:54:54
I can recommend a few changes to apply:
- Use
?symbol before your firstlinkparameter instead of&. When you create a URL with parameters the first parameter should be added after?, others after& - Send just
myLeadsinstead ofmyLeads.value, you don't have avalueproperty inside an array. Or if you want to show each element ofmyLeadson a separate line, you can domyLeads.join('\n').
Example:
const link = "mailto:example-email.com" + "?subject=" + encodeURIComponent("This is my subject") + "&body=" + encodeURIComponent(myLeads.join('\n'));
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.