C
C
Corepro2021-06-25 20:01:18
PHP
Corepro, 2021-06-25 20:01:18

How to pass js variable value to php script to send to email?

I have a calculator on js, as well as a php script for a feedback form.
How do I pass the value of the variables in php to send to the mail.
Here is the Java Script code:

const inputsCheckbox = document.querySelectorAll('.container-custom-checkbox input'),
      ingredients = document.querySelectorAll('.current-pizza-item'),
      drinks = document.querySelectorAll('.select-drink-item'),
      totalAmount = document.querySelector('.total-amount>.summa'),
      orderBtn = document.querySelector('.typical-btn'),
      modalWindow = document.querySelector('.modal-window'),
      submitBtn = document.querySelector('.modal-window__submit-btn');

const subject = document.querySelector('.modal-window__subject'),
      ingredientsSpan = document.querySelector('.modal-window__ingredients'),
      drinksSpan = document.querySelector('.modal-window__drinks');

/* Additing ingredients to pizza*/

const addIngredients = checkboxes => {
    const nodesArray = Array.from(checkboxes);
    const ingredientsArray = Array.from(ingredients);
    

    for(let node of checkboxes) {
        node.addEventListener('click', event => {
            event.target.parentNode.classList.toggle('active');
            const index = nodesArray.indexOf(event.target);
            ingredientsArray[index].classList.toggle('active');
            calculateOrder();
        })
    }
}

addIngredients(inputsCheckbox);

/* Additing drinks */

const addDrinks = drinkItems => {
    for(let item of drinkItems) {
        item.addEventListener('click', event => {
            event.target.parentNode.classList.toggle('active');
            calculateOrder();
        })
    }
}

addDrinks(drinks);

/* Calculate order */

const calculateOrder = () => {
    const ingredients = document.querySelectorAll('.container-custom-checkbox.active'),
          drinks = document.querySelectorAll('.select-drink-item.active');

    const startPrice = 300,
          ingredientsPrice = ingredients.length * 25,
          drinksPrice = drinks.length * 95;
    
    totalAmount.innerHTML = `${startPrice + ingredientsPrice + drinksPrice}₽`;
};

/* Modal window for order */


window.addEventListener('click', event => {
    if(event.target === modalWindow) {
        modalWindow.classList.add('none');
    }
});

submitBtn.addEventListener('click', () => {
    modalWindow.classList.add('none');
});

const prepareWindowModalContent = () => {
    subject.innerHTML = '';
    ingredientsSpan.innerHTML = '';
    drinksSpan.innerHTML = '';

    const addedIngredients = document.querySelectorAll('.container-custom-checkbox.active'),
          addedDrinks = document.querySelectorAll('.select-drink-item.active');

    let ingredientsList = [];
    if(addedIngredients) {
        for(let ingredient of addedIngredients) {
            ingredientsList.push(ingredient.innerText);
        }
    };

    let drinksList = [];
    if(addedDrinks) {
        for(let drink of addedDrinks) {
            drinksList.push(drink.dataset.name);
        }
    };

    const totalIngredients = ingredientsList.join(', ');
    const totalDrinks = drinksList.join(', ');
    const totalText = `Вы заказали LandingPage: '${totalIngredients}', с Вас ${totalAmount.innerHTML}`;
    
    subject.innerHTML = totalText;
}


orderBtn.addEventListener('click' , () => {
    modalWindow.classList.remove('none');
    prepareWindowModalContent();
});



  //E-mail Ajax Send
  $("form").submit(function() { //Change
    var th = $(this);
    $.ajax({
      type: "POST",
      url: "mail.php", //Change
      data: th.serialize()
    }).done(function() {
      alert("Ваша конфигурация сайта принята");
      setTimeout(function() {
        // Done Functions
        th.trigger("reset");
      }, 1000);
    });
    return false;
  });


PHP code:
<?php

$method = $_SERVER['REQUEST_METHOD'];

//Script Foreach
$c = true;
if ( $method === 'POST' ) {

  $project_name = trim($_POST["project_name"]);
  $admin_email  = trim($_POST["admin_email"]);
  $form_subject = trim($_POST["form_subject"]);
  

  foreach ( $_POST as $key => $value ) {
    if ( $value != "" && $key != "project_name" && $key != "admin_email" && $key != "form_subject" ) {
      $message .= "
      " . ( ($c = !$c) ? '<tr>':'<tr style="background-color: #f8f8f8;">' ) . "
        <td style='padding: 10px; border: #e9e9e9 1px solid;'><b>$key</b></td>
        <td style='padding: 10px; border: #e9e9e9 1px solid;'>$value</td>
      </tr>
      ";
    }
  }
} else if ( $method === 'GET' ) {

  $project_name = trim($_GET["project_name"]);
  $admin_email  = trim($_GET["admin_email"]);
  $form_subject = trim($_GET["form_subject"]);
  

  foreach ( $_GET as $key => $value ) {
    if ( $value != "" && $key != "project_name" && $key != "admin_email" && $key != "form_subject" ) {
      $message .= "
      " . ( ($c = !$c) ? '<tr>':'<tr style="background-color: #f8f8f8;">' ) . "
        <td style='padding: 10px; border: #e9e9e9 1px solid;'><b>$key</b></td>
        <td style='padding: 10px; border: #e9e9e9 1px solid;'>$value</td>
      </tr>
      ";
    }
  }
}

$message = "<table style='width: 100%;'>$message</table>";

function adopt($text) {
  return '=?UTF-8?B?'.Base64_encode($text).'?=';
}

$headers = "MIME-Version: 1.0" . PHP_EOL .
"Content-Type: text/html; charset=utf-8" . PHP_EOL .
'From: '.adopt($project_name).' <'.$admin_email.'>' . PHP_EOL .
'Reply-To: '.$admin_email.'' . PHP_EOL;

mail($admin_email, adopt($form_subject), $message, $headers );

Answer the question

In order to leave comments, you need to log in

1 answer(s)
M
Maxim Tkachev, 2022-01-26
@Real_Farmer

It's not entirely clear what's not working for you.
If an AJAX request is not sent, then perhaps you do not have a form on the page. and either you need to redo the layout, or the request
$("form").submit(function() { //Change

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question