在一次点击上顺序执行两个函数 - 添加到购物车并传递变量

Question

我有两个函数可以执行以下操作：- myFunction() 发送 variable/s 到结账 myFunction2() 将产品添加到购物车并进入购物车。该框架要求在结帐之前将产品添加到购物车。我正在努力让这两个功能通过一次点击按顺序添加。

存在三种可能的输入（用于测试），即 "Add to Cart" - 使用 href 将产品添加到购物车（正确提交） "Submit form" - 如果产品已经添加到购物车，它会将变量发送到结帐，但是因为 "Add to Cart" 已经进入购物车页面，您必须返回到 [=26= 的表单]. （提交正确，以上述为准） "Click" - 尝试结合这两个功能？，路由到购物车页面并说购物车中没有商品 - 所以没有按预期工作。

<!DOCTYPE html>
<html>

<body>

    <h2>HTML Forms</h2>

<?php $postvalue = array (12,2,3,"7 days"); ?>

    <form id="myForm" action="index.php?route=checkout/checkout" method="post">
        First name:
        <br>
        <input type="text" name="product_id" value="30">
        <?php 
            foreach($postvalue as $onx)
        {
            echo '<input type="hidden" name="onx[]" value="'. $onx . '">';
        } ?>
            <br>

            <input type="button" onclick="myFunction()" value="Submit form">
    </form>

</body>

<!-- THIS FUNCTION WORKS TO ADD A PRODUCT TO Cart -->
<a href='index.php?route=checkout/cart/addToCart&product_id=30' id="addtocart" onclick="myFunction2();">Add to Cart</a>
<br />

<script>
function myFunction2() {
    document.getElementById("addtocart");
}

function myFunction() {
    document.getElementById("myForm").submit();
}
</script>

</html>

我希望能够将产品添加到购物车并以正确的顺序将 variable/s 发布到结帐以进一步执行代码。

Answer 1

您可以使用 AJAX 发出异步请求并添加产品，同时保持相同 page.So 删除 href 属性，而不是通过访问 URL 添加产品。（我使用 return false; 来防止 onclick 事件的默认事件处理）

<a href="#" id="addtocart" onclick="myFunction2(); return false;">Add to Cart</a>

并添加代码以在点击处理程序中执行请求。当请求 returns 成功时，您只需在表单中添加一个 class，这样您就会知道产品已添加。（在示例中，我使用 jQuery 作为 AJAX 调用）。

function myFunction2() {

    $.get( "index.php?route=checkout/cart/addToCart&product_id=30", function( data ) {
    $( "#myForm" ).addClass( "product-added" ); 
   });

}

在提交表格之前，只需检查产品是否已添加到购物车

function myFunction() {

    if($( "#myForm" ).hasClass( "product-added" )){
    document.getElementById("myForm").submit();
    }

}

在一次点击上顺序执行两个函数 - 添加到购物车并传递变量

Executing two functions sequentially on one onclick - add to cart and pass variables

javascript

php

html

opencart2.x