Я работаю со встроенным приложением на нашем сайте разработчиков, и когда я нажимаю кнопку отправки внутри iframe, я запускаю событие ручной отправки в другой форме (не в iframe) на этой странице. Если я вручную нажимаю кнопку отправки формы, мои данные и все работает правильно. Однако я хочу исключить дополнительный щелчок пользователя и автоматически отправить внешнюю форму, когда пользователь отправляет другую форму внутри в фрейме.
У меня все работает правильно на базовом уровне. Когда пользователь нажимает кнопку отправки в iframe, я использую JQuery для получения значений изнутри iframe и установки значений в этой внешней форме. Используя событие jquery 'submit ()', я могу отправить эту внешнюю форму. Проблема в том, что страница обновляется, и данные никуда не уходят. Если я удаляю событие submit () и вручную нажимаю кнопку отправки, форма отправляет сообщения и в этом случае добавляет продукт с пользовательскими данными в корзину.
В качестве подтверждения концепции, это мой «iframed» HTML.
<!DOCTYPE html>
<html>
<head></head>
<body>
<h1>Proof of Concept</h1>
<p>Total cost: $<span id="cust_price">222.22</span> plus shipping.</p>
<p>Quote number: <span id="quot_num">1546751962211</p>
<form method="POST" enctype="multipart/form-data" id="newQuoteForm">
<button type="submit" class="btn btn-primary" name="new-app-btn">Add to Cart</button>
</form>
</body>
<footer>
</footer>
</html>
Вот моя форма на странице вне ВРЕМЕНИ.
<form method="POST" enctype="multipart/form-data" id="outer-quote-form" action="/checkout/">
<label class="quote_number">Quote Number:
<input type="text" id="quote_number" name="quote_number" value="">
</label>
<label class="custom_price">price:
<input type="text" id="custom_price" name="custom_price" value="">
</label>
<button type="submit" class="btn btn-primary" name="ws-add-to-cart">Add to Cart</button>
</form>
Тогда у меня есть JQuery, работающий, чтобы получить значения iframed и поместить их во внешнюю форму. После этого в этой форме запускается событие submit ().
<script>
jQuery('#newQuoteApp').load(function() {
var iFrameDOM = jQuery("iframe#newQuoteApp").contents();
jQuery('#newQuoteApp').contents().find('#newQuoteForm').submit(function() {
jQuery("input#custom_price").val(jQuery('#newQuoteApp').contents().find('#cust_price').text()); // updated
jQuery("input#quote_number").val(jQuery('#newQuoteApp').contents().find('#quot_num').text());
jQuery("#outer-quote-form").submit();
return true; //return false prevents submit
});
});
</script>
За исключением случаев, когда запускается событие jquery submit (), появляется форма для отправки, и страница обновляется, но данные не публикуются, как это происходит, когда я вручную отправляю форму. Есть ли здесь дополнительный шаг или лучший способ запустить отправку формы с почтовыми данными?
Редактировать: Добавление функции PHP, которая не запускается в jquery submit () для контекста.
if (isset($_POST['ws-add-to-cart'])) {
add_action( 'init', 'add_product_to_cart' );
function add_product_to_cart() {
global $woocommerce;
global $product;
$product_id = 138;
$woocommerce->cart->add_to_cart($product_id);
}
header("Location:https://www.devsite.com/checkout/");
}