PHP Classes

File: resources/views/checkout/index.blade.php

Recommend this page to a friend!
  Classes of Maniruzzaman Akash   Laravel Stripe Checkout   resources/views/checkout/index.blade.php   Download  
File: resources/views/checkout/index.blade.php
Role: Auxiliary script
Content type: text/plain
Description: Auxiliary script
Class: Laravel Stripe Checkout
E-commerce checkout that uses Stripe to pay orders
Author: By
Last change:
Date: 10 months ago
Size: 4,531 bytes


Class file image Download
    <x-slot name="header">
        <h2 class="font-semibold text-xl text-gray-800 dark:text-gray-200 leading-tight">
            {{ __('Checkout') }}

    <div class="py-12">
        <div class="max-w-7xl mx-auto sm:px-6 lg:px-8">
            <div class="bg-white dark:bg-gray-800">
                <div class="bg-gray-100">
                    <div class="flex flex-col md:flex-row flex-wrap w-full">
                        <div class="md:basis-3/5">
                            <div id="cart-items"></div>
                        <div class="md:basis-2/5">
                            <div class="shadow-lg bg-white p-4 md:ml-4">
                                <div id="cart-summary"></div>

                            <form method="POST" action="{{ route('') }}" id="payment-form"
                                class="shadow-lg bg-white p-4 md:ml-4">

                                    <h4 class="font-bold">Select payment method</h4>
                                    <div class="flex mt-2">
                                        <label class="basis-2/5">
                                            <input type="radio" name="payment_method" id="payment_method"
                                            Cash In delivery
                                        <img src="{{ asset('images/default/cash-in.png') }}" alt=""
                                            class="basis-3/5 max-w-[100px]">
                                    <div class="flex mt-2">
                                        <label class="basis-2/5">
                                            <input type="radio" name="payment_method" id="payment_method"
                                            Online Payment
                                        <img src="{{ asset('images/default/stripe-payments.png') }}" alt=""
                                            class="basis-3/5 max-w-[100px]">
                                <button type="submit" id="submit-button"
                                    class="bg-slate-600 px-5 py-3 mt-4 rounded text-white"
                                    href="{{ route('checkout') }}">
                                    <span id="order-confirm-text">
                                        Confirm Order

            const checkoutUrl = "{{ route('') }}";
            const paymentForm = document.getElementById('payment-form');
            const submitButton = paymentForm.querySelector('button[type="submit"]');

            const submitPayment = () => {
                submitButton.disabled = true;
                if(getCartItems().length === 0) {
                    alert('Please add a product to cart first.');

                const formData = new FormData(paymentForm);
                formData.append('products', JSON.stringify(getCartItems()));

                fetch(paymentForm.action, {
                        method: 'POST',
                        body: formData
                    .then(response => response.json())
                    .then(data => {
                        submitButton.disabled = false;
                    .catch(error => {
                        console.error('Error submitting payment: ', error);
                        submitButton.disabled = false;

            paymentForm.addEventListener('submit', event => {