single .js file sharing it's data with 2 html page calls - javascript

Hi I have 2 html pages that use functions in a single .js file. The second page needs access to data first initialised by the first page when it calls the .js file:
$(document).ready(function()
{
var destinationTo = "";
var departingFrom = "";
var departing = "";
var returning = "";
var numAdults = "";
var numChildren = "";
var travelType = "";
$("#departing").datepicker();
$("#returning").datepicker();
$("#orderTickets").click(function()
{
destinationTo = $("#myDestination option:selected").text();
departingFrom = $("#myDepart option:selected").text();
departing = $("#departing").val();
returning = $("#returning").val();
numAdults = $("#adults option:selected").text();
numChildren = $("#children option:selected").text();
travelType = $("#class option:selected").text();
var item = document.getElementById("hiddenListItem");
if (departing === "" && returning === "")
{
alert("Please enter your travel dates.");
}
else if (item.style.display !== 'none' && returning === "")
{
alert("Please enter a return date.");
}
else if (departing === "")
{
alert("Please enter a departing date.");
}
else
{
if (item.style.display !== 'list-item')
{
var isConfirmed = confirm("Please confirm your travel: outward journey from " + departingFrom + " on " + departing + " to " + destinationTo +
" adults " + numAdults + " children " + numChildren + " travelling in " + travelType + " coach " + "?");
if(isConfirmed == true)
{
window.location.href = 'PersonDetail.html';
}
}
else
{
var isConfirmed = confirm("Please confirm your travel: outward journey from " + departingFrom + " on " + departing + " to " + destinationTo + " returning on " +
returning + " adults " + numAdults + " children " + numChildren + " travelling in " + travelType + " coach " + "?");
if(isConfirmed == true)
{
window.location.href = 'PersonDetail.html';
}
}
}
});
$("#startAgain").click(function()
{
document.getElementById("travelDetailsForm").reset();
});
$("#finish").click(function()
{
var name = $("#name").val();
var addy1 = $("#address1").val();
var addy2 = $("#address2").val();
var addy3 = $("#address3").val();
var email = $("#email").val();
var number = $("#number").val();
travelType = $("#class option:selected").text();
// test
confirm("name " + name + " addy1 " + addy1 + " addy2 " + addy2 + " addy3 " + addy3 + " email " + email + " number " + number + " detion " + destinationTo);
});
});
I want to be able to access the data in the function call "#orderTickets" in the function "#finish" to dispay the order detils to the user etc. I thought I could put the variables in the global position, but think they reset themselves when another page accesses the .js file.
HTML and javascript are not my thing, would appreciate some help with this.
EDIT: the user clicks "order tickets" on html page 1, .js validates page 1 then directs to html page 2, (same .js file) validates page 2 and hopefully displays data collected from page 1 & 2.

You are partly correct when you say that the variables reset themselves. What actually happens is that each page has their own environment, so the variables from the previous page doesn't even exist any longer. Each page gets their own set of brand new variables.
Also, the variables that you have aren't even global in the page. They exist in the scope of the ready event handler. The reason that the variables exist at all after the ready event handler finishes is that they are caught in the closure of the click event handlers.
To keep the values from one page to the next, you have to store them outside of the page itself. You can for example put the values in a cookie, which you then can read in the second page.

Related

Is it possible to copy to clipboard using Javascript? [duplicate]

This question already has answers here:
How do I copy to the clipboard in JavaScript?
(27 answers)
Closed 3 years ago.
I'm working on a sharepoint webpart which has a button pull elements from different text boxes on the same page and collates them together in a single string to then copy to the user's clipboard so they can quickly put together a communication for an issue. So far I have the below code, but it's not actually copying anything. I've run it through JSHint and that's not turned up any issues, but I picked up the code at the bottom of the function for copying the text from a tutorial about interacting with the clipboard API for how to copy from a text box, hence why I add everything to the smsToSend text area. A note for people is that if there's an issue that's brand new and hasn't been sent out before, then the incident update is always 'we are investigating the issue' as this is automatically placed into the field, which is why I testing against it, as both new and update communications would have 'Open' as the incident status.
function generateSMS(){
var issueTitle = document.getElementById("incidentTitle");
var advisorImpact = document.getElementById("advisorImpact");
var incidentUpdate = document.getElementById("incidentUpdate");
var incidentStatus = document.getElementById("incidentState");
var startTime = document.getElementById("startTime");
var endTime = document.getElementById("endTime");
var smsToSend = document.createElement('textarea');
var incidentPriority = document.getElementById("incidentPriority");
var incidentBrand = "TechTeams";
var systemImpacted = document.getElementById("systemImpacted");
var incidentReference = document.getElementById("incidentReference");
if (incidentStatus != "Closed"){
if (incidentUpdate == "We are investigating this issue"){
smsToSend = "P" + incidentPriority + " " + incidentBrand + "IT ISSUE: " + systemImpacted + ": " + issueTitle + ". " + advisorImpact + ": " + incidentReference;
}
else {
smsToSend = "P" + incidentPriority + " " + incidentBrand + "IT UPDATE: " + systemImpacted + ": " + incidentUpdate + ": " + incidentReference;
}
}
else{
smsToSend = "P" + incidentPriority + " " + incidentBrand + "IT RESOLVED: " + systemImpacted + ": " + incidentUpdate + ": Start: " + startTime + " End: " + endTime + " Reference: " + incidentReference;
}
smsToSend.setAttribute('readonly','');
smsToSend.style = {position: 'absolute', left: '-9999px'};
document.body.appendChild(smsToSend);
smsToSend.select();
document.execCommand('copy');
document.body.removeChild(smsToSend);
}
You can easly copy to clipboard with js like so:
function CopyToClipboard(text) {
/* Get the text field */
var copyText = document.getElementById("elementId").textContent; //here you get the text
var dummy = $('<textarea>').val(copyText).appendTo('body').select();
document.execCommand('copy');//here the text gets copyed
alert("Text copyed to clipboard!");
$(dummy).remove();// here you remove the dummy that has been created previously
}

Copy command in html for chrome to copy multiple text boxes

I am creating a note pad that is to help keep notes consistent between users. I am unable to copy the multiple text boxes to a string. I have attached all of my Java Script.
The copy button that I would like to use to link the multiple text boxes into one string of text. the reset button works at clearing the page and the copy button follows the not empty text box checks. Please help with my copy string to the clipboard.
I have tried a bunch of different sites on the java script with no success. I have also reviewed Stack Overflow to see if I could find a close project.
input type="button" id="BtnSupSubmit" value="Copy" onclick="notEmptySup()" style="width: 87px"
function settime() {
var curtime = new Date();
var curhour = curtime.getHours();
var curmin = curtime.getMinutes();
var time = "";
if (curhour == 0) curhour = 12;
time = (curhour > 12 ? curhour - 12 : curhour) + ":" +
(curmin < 10 ? "0" : "") + curmin + ":" +
(curhour > 12 ? "PM" : "AM");
document.date.clock.value = time;
clock = time
window.status = time
}
function notEmptySup() {
var myTextField = document.getElementById('TxtBoxCallersName');
if (myTextField.value != "") notEmptySup2()
else
alert("Please enter callers name.")
}
function notEmptySup2() {
var myTextField = document.getElementById('TxtBoxSupIssue');
if (myTextField.value != "") notEmptySup3()
else
alert("Please enter the reason for the escalation.")
}
function notEmptySup3() {
var myTextField = document.getElementById('TxtBoxSupAction');
if (myTextField.value != "") notEmptySup4()
else
alert("Please enter the action you took to help the customer.")
}
function notEmptySup4() {
var myTextField = document.getElementById('TxtBoxSupResolution');
if (myTextField.value != "") CreateMessage()
else
alert("Please enter the resolution of the call.")
}
function CreateMessage() {
strMessage =
"Time: " + clock + "\|" +
"***Supervisor Escalation" + "\***|" +
"Caller: " + document.getElementById("TxtBoxCallersName").value + " \| " +
"Reason: " + document.getElementById("TxtBoxSupIssue").value + " \| " +
"Action: " + document.getElementById("TxtBoxSupAction").value + " \| " +
"Resolution: " + document.getElementById("TxtBoxSupResolution").value + " \| " +
"Ticket Number: " + document.getElementById("TxtBoxSupTicketNumber").value + " \| " +
"Addl Notes: " + document.getElementById("TxtBoxSupNotes").value;
document.getElementById("hdnBuffer").value = strMessage;
var buffer = document.getElementById("hdnBuffer").createTextRange();
buffer.execCommand("Copy");
}
Most of what you have is redundant. See comments inline below:
// Get a reference to the form
let frm = document.querySelector("form")
// Set up a sumbit event handler for the form
frm.addEventListener("submit", function(evt){
// Just get the locally formatted time
var message = "Time: " + new Date().toLocaleTimeString() +
"\n***Supervisor Escalation***\n\n";
// Get all the input elements
let inputs = document.querySelectorAll("input");
// Loop over them
for(let i = 0; i < inputs.length; i++){
if(inputs[i].value === ""){
alert("Please enter the " + inputs[i].dataset.message);
inputs[i].focus(); // Put focus on bad element
evt.preventDefault(); // Cancel the form submit
break; // Exit the loop
} else {
// Update the message
message += inputs[i].dataset.message + ": " +
inputs[i].value + " \n";
}
}
alert(message); // Do whatever you want with the message
});
<form action="https://example.com" method="post">
<div><label>Name:<input data-message="callers name"></label></div>
<div><label>Issue: <input data-message="reason for the escalation"></label></div>
<div><label>Action: <input data-message="action you took to help the customer"></label></div>
<div><label>Resolution: <input data-message="resolution of the call"></label></div>
<button type="submit">Submit Ticket</button>
</form>

Bold text in email - Google Spreadsheet

I'm looking some way to bold text in email and when I open the msgBox.
I want bold only headlines, like in picture below:
this is my script, you choose some cell in row that interests you and run the function. Function show information about data from every cell in row, like inforamtion about "Name" and "email". Then if you push send it will send email with this informations. I want bold headlines for better clarity.
function sendEmail(){
var ss = SpreadsheetApp.getActiveSpreadsheet();
var fr1 = ss.getSheetByName("Sheet1");
var cell = ss.getActiveCell().getRow();
var lastColumn = fr1.getLastColumn();
var lastRowValues = fr1.getRange(cell,1,1,lastColumn).getValues();
var Nr = lastRowValues[0][0];
var Data = lastRowValues[0][1];
var Information = lastRowValues[0][2];
var Name = lastRowValues[0][3];
var email = lastRowValues[0][4];
var urlOfSS = ss.getUrl();
var message = "Message" +
"\n " +
"\nNr: " + Nr +
"\nData: " + Data +
"\nInformation: " + Information +
"\nName " + Name +
"\nEmail: " + email +
"\n " +
"\n Link to spreadsheet:" +
"\n " + urlOfSS;
var emails = ss.getSheetByName("Sheet1");
var numRows = emails.getLastRow();
var emailTo = email;
var subject = "Zgłoszenie FAS - " + Nr;
if (email == ""){
Browser.msgBox('This row is empty - Choose another');
} else {
var ui = SpreadsheetApp.getUi();
var l = ss.getSheets()[0]
var response = ui.alert('Email', "Do you want email \nNr: " + l.getRange(cell, 1).getValue() + "\nData: " + l.getRange(cell, 2).getValue() + "\nInforamtion: " + l.getRange(cell, 3).getValue()
+ "\nName: " + l.getRange(cell, 4).getValue(), ui.ButtonSet.YES_NO);
if (response == ui.Button.YES) {
GmailApp.sendEmail(emailTo, subject, message);
} else {
Logger.log('The user clicked "No" or the dialog\'s close button.');
}
}
}
Regards
If I understand the requirement, Only the side headers(underlined in the screenshot) needs decoration.
While going through the Google Apps Scripts - Documentation, I came through this.
Hope this helps you.
Using the HtmlServices & HtmlOutputFromFile() would fulfill your requirement.
Please refer to Custom Dialogs. This would help you
https://developers.google.com/apps-script/guides/dialogs

So I've restarted my While-loop program and now am getting all NaN or they aren't saving the text I input

I need to write a program for a wedding planner. They wish to create a gift registry for each couple. They want the gifts broken down by the whether the gift giver is on the bride side or groom side. They also know that specific gifts (toasters, silverware, and stemware) tend to be repeated so they want those gifts listed and have the name of the gift giver under them. The repeating gifts are only the ones that have been told you by the client (toasters, silverware, and stemware) they do not want you to determine which gifts repeat, they are just looking for those specific three. So I can implement code for only silverware, stemware, and toasters, which I have this time. But now I cannot get any correct output.
After the program has run, it should have a printout somewhat like this.
Groom side:
Tom: toaster
Bill: silverware
Bob: stemware
Steve: Lexus
Bride side:
Jill: toaster
Suzy: silverware
Pat: stemware
Karen: horse
Multiple toasters by:
Tom
Jill
Multiple silverware by:
Bill
Suzy
Multiple stemware by:
Bob
Pat
Here is what I've got so far...
var guestName;
var gift, side, kind, groomNameAccum, brideNameAccum;
var toaster, silverware, stemware, giftType;
var toasterAccum, silverwareAccum, stemwareAccum;
var noGift = 0;
var groomCounter = 0;
var brideCounter = 0;
//initalizing loop
var guest = "yes";
//start loop
while (guest == "yes") {
side = prompt("Which side are you on? groom or bride?", "");
guestName = prompt("Whats your name?", "");
kind = prompt("What kind of gift?", "");
if (side == "groom") {
groomCounter = groomCounter + 1;
if (groomCounter == 1) {
groomNameAccum = "Groom side: <br>" + groomCounter + ". " + guestName + ": " + kind;
} else {
groomNameAccum = groomNameAccum + "<br>" + groomCounter + ". " + guestName + ": " + kind;
}
} else
if (side == "bride") {
brideCounter = brideCounter + 1;
if (brideCounter == 1) {
brideNameAccum = "<p>Bride side: <br>" + brideCounter + ". " + guestName + ": " + kind;
} else {
brideNameAccum = brideNameAccum + "<br>" + brideCounter + ". " + guestName + ": " + kind;
}
}
if (kind == "toaster")
{
toasterAccum = toasterAccum + "; " + guestName;
}
else if(kind == "silverware")
{
silverwareAccum= silverwareAccum + "; " + guestName;
}else if (kind == "stemware")
{
stemwareAccum = stemwareAccum + "; " + guestName
}
else
{
multiples = 0;
}
guest = prompt("Are there anymore guests?", "yes");
}
document.write(groomNameAccum);
document.write(brideNameAccum);
document.write("<p>Multiple Toasters by:<br>" + toasterAccum + "<br/>");
document.write("Multiple Silverware by:<br>" + silverwareAccum + "<br/>");
document.write("Multiple Stemware by:<br>" + stemwareAccum + "<br/>");
As I was saying, my teacher doesn't try to teach us the shortcuts and easy stuff, because it is a classroom of technical college students. I know there are easier ways to write it out, but I don't know how yet. Hes got his formula for success that always leads me looking for correct answers....

I can't figure out how to write this "if statement"

I need to have only the multiple gifts outputted by the names of people that gave the gift.
example: multiple toasters by: jack and jill
heres my code: thanks for the help. My loop works but not my ending if statement. confused...
<script type="text/javascript">
var guest = "yes"
var gift, side, yourName, kind, groomNameAccum, brideNameAccum;
var toaster, silverware, stemware, giftType;
var noGift = 0;
var groomCounter = 0;
var brideCounter = 0;
kind = parseInt(kind);
//initalizing loop
weddingGift = "yes"
//start loop
while (guest == "yes") {
side = prompt("Which side are you on? groom or bride?", "")
yourName = prompt("Whats your name?", "");
kind = prompt("What kind of gift?", "");
if (side == "groom") {
groomCounter = groomCounter + 1;
if (groomCounter == 1) {
groomNameAccum = "Groom side: <br>" + groomCounter + ". " + yourName + ": " + kind;
} else {
groomNameAccum = groomNameAccum + "<br>" + groomCounter + ". " + yourName + ": " + kind;
}
} else
if (side == "bride") {
brideCounter = brideCounter + 1;
if (brideCounter == 1) {
brideNameAccum = "<p>Bride side: <br>" + brideCounter + ". " + yourName + ": " + kind;
} else {
brideNameAccum = brideNameAccum + "<br>" + brideCounter + ". " + yourName + ": " + kind;
}
}
if (kind > 1) {
giftType = toaster + silverware + stemware;
} else {
giftType = noGift;
}
guest = prompt("Are there anymore guests?", "yes");
}
document.write(groomNameAccum);
document.write(brideNameAccum);
document.write("<p>Multiples Toasters by:<br>" + giftType + yourName + "<br/>");
document.write("Multiples Silverware by:<br>" + gift + "<br/>");
document.write("Multiples Stemware by:<br>" + gift);
// -->
</script>
If kind should be an integer then there should be parseInt before if (kind > 1) {
kind = parseInt(kind);
if (kind > 1) {
giftType = toaster + silverware + stemware;
} else {
giftType = noGift;
}
Or simply
kind = parseInt(prompt("What kind of gift?", ""));
Because promt returns a string or null.
Here in the popup for "What kind of gift?" we are entering some text for that. If you are doing parseInt(kind) but its value is text only. So in java script you are not able do any operation between two different types like (int and text). So the last if condition for if(kind > 1) is not executing.
Demo

Categories

Resources