Jquery or Code to update the order form total on Infusionsoft order form

34 Views Asked by abdul At 10 October 2023 at 02:44

I'm trying to dynamically update the order form total as I have two quantity fields that the user will update then the price will increase depending on the quantity they have set.

I can't find any code that will dynamically update the total of the order form through a custom code

Original Q&A

There are 1 best solutions below

Safa Awan On 10 October 2023 at 05:55

You can use JavaScript (including jQuery) to listen for changes in the quantity fields and calculate the total accordingly. Here's a sample code:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
</head>
<body>
    <!-- Quantity Fields -->
    <label for="quantity1">Quantity 1:</label>
    <input type="number" id="quantity1" value="0">
    <br>
    <label for="quantity2">Quantity 2:</label>
    <input type="number" id="quantity2" value="0">
    <br>
    <!-- Display Total -->
    <p>Total: $<span id="total">0.00</span></p>

    <script>
        // Function to update the total based on quantity fields
        function updateTotal() {
            // Get the values of quantity fields
            var quantity1 = parseInt($('#quantity1').val());
            var quantity2 = parseInt($('#quantity2').val());
            
            // Calculate the total based on your pricing logic
            var total = (quantity1 * 10) + (quantity2 * 15); // Adjust pricing as needed
            
            // Update the total display
            $('#total').text(total.toFixed(2));
        }

        // Attach change event listeners to quantity fields
        $('#quantity1, #quantity2').on('change', function() {
            updateTotal();
        });

        // Initial total update
        updateTotal();
    </script>
</body>
</html>

Jquery or Code to update the order form total on Infusionsoft order form

There are 1 best solutions below

Related Questions in HTML

Related Questions in JQUERY

Related Questions in INFUSIONSOFT

Trending Questions

Popular # Hahtags

Popular Questions