Copy command in html for chrome to copy multiple text boxes

Question

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");
    }

Answer 1

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>