Ecommerce Shopify WordPress Discussion

Redirection Form from product page to checkout page in shopify

Write form code that follows the shopify standards for product page that directs the customer straight to checkout page with form field data and product properties attached in incorporated on checkout page. The form has the following fields: Discount code First Name Last Name Address Address 2 Phone City State Email Zip Code Rush my order submit button I tried this code but it does not work: <form id="checkout-form"> <label for="discount-code">Discount Code:</label> <input type="text" id="discount-code" name="discountCode" ><br> <label for="first-name">First Name:</label> <input type="text" id="first-name" name="firstName" required><br> <label for="last-name">Last Name:</label> <input type="text" id="last-name" name="lastName" required><br> <label for="address">Address:</label> <input type="text" id="address" name="address" required><br> <label for="address-2">Address 2:</label> <input type="text" id="address-2" name="address2"><br> <label for="phone">Phone:</label> <input type="tel" id="phone" name="phone" required><br> <label for="city">City:</label> <input type="text" id="city" name="city" required><br> <label for="state">State:</label> <input type="text" id="state" name="state" required><br> <label for="email">Email:</label> <input type="email" id="email" name="email" required><br> <label for="zip-code">Zip Code:</label> <input type="text" id="zip-code" name="zipCode" required><br> <button type="submit" id="rush-order-submit">Rush My Order</button> </form> <script> document.getElementById('checkout-form').addEventListener('submit', function(event) { event.preventDefault(); // Get form data const formData = { discountCode: document.getElementById('discount-code').value, firstName: document.getElementById('first-name').value, lastName: document.getElementById('last-name').value, address: document.getElementById('address').value, address2: document.getElementById('address-2').value, phone: document.getElementById('phone').value, city: document.getElementById('city').value, state: document.getElementById('state').value, email: document.getElementById('email').value, zipCode: document.getElementById('zip-code').value }; // Get product properties (example values, replace with actual product data) const productProperties = { productName: '{{ product.title }}', price: {{product.price}}, quantity: 1 }; // Redirect to Shopify checkout page with form and product properties as query parameters const checkoutUrl = '/checkout'; // Update with your Shopify checkout URL const queryParams = new URLSearchParams({...formData, ...productProperties}).toString(); window.location.href = `${checkoutUrl}?${queryParams}`; }); </script>
TurboCommerce make the better internet purchasing globaly

Turbo Multi-language Translator

Make the better internet purchasing globaly

Turbosify SEO Speed Booster

5.0 (7) Free plan available
Get better conversions by improving store loading speed Installed

Turbo Multi-language Chat - AI Customer service in one hand

TurboCommerce make the better internet purchasing globaly
Our products

The help you need, when you need it

App by Turbo Engine

3 apps • 5.0 average rating

Turbosify Speed Booster

5.0 (7)
Get better conversions by optimizing shopify store Google page speed Installed

Turbosify Translator for Wordpress Woocommerce

5.0 (74) Free Wordpress Woocommerce Plugin
Translate your wordpress website to multiple language within 1 click, no configuration needed, no No technical required

Grow your business here

Whether you want to sell products down the street or around the world, we have all the tools you need.