$(document).ready(function() { // Function to update the iframe content function updateIframeContent() { var textareaContent = $("#html_content").val(); $("#iframe_id").attr("srcdoc", textareaContent); } // Add a click event handler for the "Render" tab $("#pills-render-tab").on("click", function() { updateIframeContent(); }); // Initially update the iframe content updateIframeContent(); }); // Function to initialize the iframe resizing function initResizableIframe() { const iframe = document.getElementById('iframe_id'); // Function to update the iframe's height based on its content function updateIframeHeight() { const iframeDocument = iframe.contentWindow.document; const newHeight = iframeDocument.body.scrollHeight || 'auto'; iframe.style.height = newHeight + 'px'; } // Attach the update function to iframe's load event and window's resize event iframe.onload = updateIframeHeight; window.addEventListener('resize', updateIframeHeight); // Initialize the iframe height updateIframeHeight(); } // Call the initialization function when the document is ready document.addEventListener('DOMContentLoaded', initResizableIframe); $(document).ready(function() { let headerCount = 1; // Add Header button click event $("#addHeaderButton").click(function() { // Create a new header/value/delete form var newRow = $('<div class="form-row align-items-center">' + '<div class="col-md-5 mb-3">' + '<label for="input_id_' + headerCount + '">Header</label>' + '<input type="text" class="form-control form-control-sm" name="header_name_' + headerCount + '" id="header_id_' + headerCount + '" placeholder="CC, BCC, Reply-To">' + '</div>' + '<div class="col-md-5 mb-3">' + '<label for="input_id_' + headerCount + '">Value</label>' + '<input type="text" class="form-control form-control-sm" name="header_value_' + headerCount + '" id="header_id_' + headerCount + '" placeholder="person@place.com">' + '</div>' + '<div class="col-md-2 mb-3">' + '<label for="input_id_' + headerCount + '"></label>' + '<button type="button" class="btn btn-danger btn-sm delete-button">Delete</button>' + '</div>' + '</div>'); // Append the new header/value/delete form to the form group $(".header-row").append(newRow); $("#headerCount").val(headerCount); // Increment the headerCount for the next set headerCount++; }); // Delete button click event $(document).on("click", ".delete-button", function() { // Remove the parent row when the delete button is clicked $(this).closest(".form-row").remove();// Decrement the headerCount when a row is deleted }); }); // to display ile name when attachment is chosen $(document).ready(function () { // Add an event listener to the file input $('#attachment').change(function () { // Get the name of the selected file var fileName = $(this).val().split('\\').pop(); // Update the label text with the file name $('.custom-file-label').html(fileName); }); }); let lastSubmittedData = null; function submitForm() { // Create a FormData object to easily handle form data, including file uploads const formData = new FormData(document.getElementById('emailForm')); // Get the headerCount value from the hidden input let headerCount = parseInt(document.getElementById('headerCount').value); // Convert dynamic header inputs into an array of objects const headers = []; let newHeaderCount = 0; for (let i = 1; i <= headerCount; i++) { const headerNameInput = document.querySelector(`[name="header_name_${i}"]`); const headerValueInput = document.querySelector(`[name="header_value_${i}"]`); // Check if both headerNameInput and headerValueInput exist if (headerNameInput && headerValueInput) { const headerName = headerNameInput.value; const headerValue = headerValueInput.value; // Check if both headerName and headerValue exist if (headerName && headerValue) { newHeaderCount++; // Rename the input fields to reflect new IDs headerNameInput.name = `header_name_${newHeaderCount}`; headerValueInput.name = `header_value_${newHeaderCount}`; headers.push({ name: headerNameInput.name, value: headerValueInput.name }); } } } // Update the headerCount hidden input with the new count document.getElementById('headerCount').value = newHeaderCount; headerCount = parseInt(document.getElementById('headerCount').value); // Add the headers as a JSON string to the FormData formData.append('headers', JSON.stringify(headers)); // Convert form data to a JSON string for comparison const currentData = JSON.stringify(Array.from(formData.entries())); // Check if the form data has changed if (currentData === lastSubmittedData) { const resultElement = document.getElementById('result'); resultElement.textContent = "Already tried to send this data"; resultElement.style.color = "red"; return; } // Save the current form data for future comparison lastSubmittedData = currentData; // Send the form data to "submit.php" fetch('submit.php', { method: 'POST', body: formData, }) .then(response => response.text()) // Read the response as plain text .then(data => { // Handle the response from the server here const resultElement = document.getElementById('result'); resultElement.textContent = data; if (data === "Success") { resultElement.style.color = "lightgreen"; } else { resultElement.style.color = "red"; } }) .catch(error => { // Handle errors here console.error('Error:', error); }); }