diff --git a/javascripts/answers.js b/javascripts/answers.js index 35f0cde..d84f1f6 100644 --- a/javascripts/answers.js +++ b/javascripts/answers.js @@ -1,39 +1,64 @@ window.addEventListener("load", function() { - var questions = document.getElementsByClassName("question"); - console.log(questions); - for (const [index, element] of Array.from(questions).entries()) { - // - const ansElem = document.createElement("textarea"); - ansElem.setAttribute("id", "question" + (index + 1)); - ansElem.setAttribute("placeholder", "Type your answer here..."); - ansElem.classList.add("input-box"); - element.insertAdjacentElement("afterend", ansElem); - // Automatically resize textareas based on input - ansElem.addEventListener('input', function() { - this.style.height = 'auto'; - this.style.height = (this.scrollHeight) + 'px'; - saveAnswers(); - }); - }; + // Process .question elements to add corresponding inputs + const questions = document.getElementsByClassName("question"); + for (const [index, element] of Array.from(questions).entries()) { + const ansElem = document.createElement("textarea"); + ansElem.setAttribute("id", "question" + (index + 1)); + ansElem.setAttribute("placeholder", "Type your answer here..."); + ansElem.classList.add("input-box"); + element.insertAdjacentElement("afterend", ansElem); + + // Save answers on input change + ansElem.addEventListener("input", saveAnswers); + } + + // Save table inputs + const tableInputs = document.querySelectorAll("table input[type='text']"); + tableInputs.forEach(input => { + input.addEventListener("input", saveAnswers); + }); + + // Load previously saved answers + loadAnswers(); }); -// Function to save answers to localStorage -function saveTableAnswers() { - const inputs = document.querySelectorAll('table input[type="text"]'); - inputs.forEach(input => { - const value = input.value || ''; // Get the input value or an empty string - localStorage.setItem(input.id, value); // Save value in localStorage using the input's ID +// Function to save all answers (textarea and table inputs) +function saveAnswers() { + // Save textareas + const textareas = document.querySelectorAll('textarea[id^="question"]'); + textareas.forEach(textarea => { + const answer = textarea.value || ''; + localStorage.setItem(textarea.id, answer); }); + + // Save table inputs + const tableInputs = document.querySelectorAll("table input[type='text']"); + tableInputs.forEach(input => { + const answer = input.value || ''; + const inputId = input.id || `table-input-${Array.from(tableInputs).indexOf(input)}`; + localStorage.setItem(inputId, answer); + }); + console.log("Answers saved to local storage."); } -// Load answers from localStorage -function loadTableAnswers() { - const inputs = document.querySelectorAll('table input[type="text"]'); - inputs.forEach(input => { - const savedValue = localStorage.getItem(input.id) || ''; // Load the saved value or an empty string - input.value = savedValue; // Set the value to the input field +// Function to load saved answers +function loadAnswers() { + // Load textareas + const textareas = document.querySelectorAll('textarea[id^="question"]'); + textareas.forEach(textarea => { + const savedAnswer = localStorage.getItem(textarea.id) || ''; + textarea.value = savedAnswer; }); + + // Load table inputs + const tableInputs = document.querySelectorAll("table input[type='text']"); + tableInputs.forEach(input => { + const inputId = input.id || `table-input-${Array.from(tableInputs).indexOf(input)}`; + const savedAnswer = localStorage.getItem(inputId) || ''; + input.value = savedAnswer; + }); + console.log("Answers loaded from local storage."); } @@ -72,7 +97,7 @@ window.addEventListener("load", function() { }); -// Function to download the answers as a PDF with a more professional layout +// Function to download the answers as a PDF document.getElementById('downloadBtn').addEventListener('click', function() { const questions = document.querySelectorAll('.question'); let answersHTML = ` @@ -81,16 +106,17 @@ document.getElementById('downloadBtn').addEventListener('click', function() {

Submitter

`; + // Include table data const table = document.querySelector('table.personal-details'); for (var i = 0, row; row = table.rows[i]; i++) { - answersHTML += ``; + answersHTML += ``; } answersHTML += `
${row.cells[0].textContent}${row.cells[1].children[0].value}
${row.cells[0].textContent}${row.cells[1].children[0].value}
`; questions.forEach((question, index) => { - const questionNumber = index + 1; // Incrementing index for question number - const questionText = question.innerHTML; // Get the question text - const answerText = document.getElementById(`question${questionNumber}`).value; // Get the corresponding answer + const questionNumber = index + 1; + const questionText = question.innerHTML; + const answerText = document.getElementById(`question${questionNumber}`).value; answersHTML += `

${questionText}

@@ -98,7 +124,7 @@ document.getElementById('downloadBtn').addEventListener('click', function() { `; }); - answersHTML += ``; // Closing the div + answersHTML += ``; const opt = { margin: 1,