0

I use this sandbox for the payment section of the store site. I want to redirect the user to page Done after successful payment, but the current page is loaded again! pealse help

view of payment_process:

def payment_process(request):
    order_id = request.session.get('order_id')
    order = get_object_or_404(Order, id=order_id)
    total_cost = order.get_total_cost()
    if request.method == 'POST':
        nonce = request.POST.get('paymentMethodNonce', None)
        result = gateway.transaction.sale({
            'amount': f'{total_cost:.2f}',
            'payment_method_nonce': nonce,
            'options': {
                'submit_for_settlement': True
            }
        })
        if result.is_success:
            order.paid = True
            order.braintree_id = result.transaction.id
            order.save()
            return redirect('payment:done')
        else:
            return redirect('payment:canceled')
    else:
        client_token = gateway.client_token.generate()
        return render(request, 'payment/process.html', {'order': order, 'client_token': client_token})

page of Done.html:

{% extends "shop/base.html" %}

{% block title %} Pay by credit card {% endblock %}

{% block sidenavigation %}

{% endblock %}

{% block content %}
    <h1>Pay by credit card</h1>

    <!-- includes the Braintree JS client SDK -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
    <script src="https://js.braintreegateway.com/web/dropin/1.14.1/js/dropin.min.js"></script>

    <form method="post" autocomplete="off">
        {% if braintree_error %}
            <div class="alert alert-danger fade in">
                <button class="close" data-dismiss="alert">&times;</button>
                {{ braintree_error|safe }}
            </div>
        {% endif %}
        <div class="braintree-notifications"></div>
        <div id="braintree-dropin"></div>
        <input style="background-color: #0783ca" id="submit-button" class="btn btn-success btn-lg btn-block"
               type="button" value="Pay now!"/>
    </form>

    <script>
        var braintree_client_token = "{{ client_token}}";
        var button = document.querySelector('#submit-button');

        braintree.dropin.create({
            authorization: "{{client_token}}",
            container: '#braintree-dropin',
            card: {
                cardholderName: {
                    required: false
                }
            }
        }, function (createErr, instance) {
            button.addEventListener('click', function () {
                instance.requestPaymentMethod(function (err, payload) {
                    console.log('ok')
                    $.ajax({
                        type: 'POST',
                        url: '{% url "payment:process" %}',
                        data: {
                            'paymentMethodNonce': payload.nonce,
                            'csrfmiddlewaretoken': '{{ csrf_token }}'
                        },
                    }).done(function (result) {
                        //do accordingly
                    });
                });
            });
        });
    </script>

{% endblock %}

this is pic of terminal when click to 'pay now!' button: enter image description here

this is pic of process.html when befor click to 'pay now!' button: enter image description here

this is pic of process.html when after click to 'pay now!' button: enter image description here

Remo
  • 93
  • 1
  • 1
  • 5
  • what happening after clicking on pay now – Manoj Tolagekar Dec 02 '22 at 10:48
  • Your terminal output looks pretty much like text, so please post it as text, not as picture of text which is hard to read. Besides it clearly shows that you do have 302 redirect and 200 success of loading payment/done so it's unclear what your question is about. You stated the opposite - that you don't get redirected which is clearly not what's going on. – Ivan Starostin Dec 02 '22 at 11:19
  • I want when the credit card form information is filled and the 'pay now' button is pressed and the post method is executed, if the payment is successful, it will be directed to View Done, and if the payment is unsuccessful, to View Canceled! But now when I fill the form information and click the 'pay now' button, the process.html is loaded again, but with the appearance of the third photo! – Remo Dec 02 '22 at 12:53
  • show corresponding url patterns and views code. also note that you are doing ajax request thus you must organize reaction on request complete and handle response on your own. so this `//do accordingly` matters – Ivan Starostin Dec 02 '22 at 12:59

1 Answers1

0

I think you are rendering process.html after else statement.

Change this:

else:
    client_token = gateway.client_token.generate()
    return render(request, 'payment/process.html', {'order': order, 'client_token': client_token})

To this:

    else:
        client_token = gateway.client_token.generate()
    return render(request, 'payment/process.html', {'order': order, 'client_token': client_token})

Because of this problem, that is happening.

Manoj Tolagekar
  • 1,816
  • 2
  • 5
  • 22
  • i'm afraid this will not make any difference because there is no alternative flow that would miss either `redirect` or `render` – Ivan Starostin Dec 02 '22 at 11:23