General Questiona about Javascript

Question

I have a sample script from PayPal, and they hardcoded the dollar amount. (See the value of $88.44.)

I'd like to have a variable inside my web app (in C#) and pass that variable/amount to the script.
How can that be done? What's the right syntax?

                paypal.Buttons({
                    createOrder: function (data, actions) {
                        return actions.order.create({
                            purchase_units: [{
                                amount: {
                                    value: '88.44'
                                }
                            }]
                        });
                    },

                    onApprove: function (data, actions) {
                        return actions.order.capture().then(function (orderData) {
                            var transaction = orderData.purchase_units[0].payments.captures[0];

                             const element = document.getElementById('paypal-button-container');
                             element.innerHTML = '';
                             element.innerHTML = '<h3>Thank you for your payment!</h3>';
                        });
                    }
                }).render('#paypal-button-container');

Answer 1

create a hidden field

<input type="hidden" name="paypalAmount" id="paypalAmount" value="@默 .paypalAmount" />

then in the javascript:

                             purchase_units: [{  
                                 amount: {  
                                     value: document.getElementById('paypalAmount')  
                                 }  

note: as the user can hack this value, be sure to reconcile the amount.

Answer 2

There a lots of ways dending on your needs

1. Ajax call to the server to get the amount
2. Render the amount in a hidden field that JavaScript accesses
3. Render a inline JavaScript setting a variable to the value.

Answer 3

Hi @Coreysan ,
You could return the SetExpressCheckout response to the client using ajax.

paypal.Buttons({  
  createOrder: function() {  
    var SETEC_URL = 'https://mystore.com/api/paypal/set-express-checkout';  
  
    return fetch(SETEC_URL, {  
      method: 'post',  
      headers: {  
        'content-type': 'application/json'  
      }  
    }).then(function(res) {  
      return res.json();  
    }).then(function(data) {  
      return data.token;  
    });  
  }  
}).render('#paypal-button-container');  

---

If the answer is helpful, please click "Accept Answer" and upvote it.

Note: Please follow the steps in our  documentation  to enable e-mail notifications if you want to receive the related email notification for this thread.

Answer 4

@Yijing Sun-MSFT - Thank you very much for your response.

I apologize that I didn't clarify something:

The script above that I show uses a new product PayPal calls "Smart Buttons" where they are trying to make it easier for people like me.
I don't know ajax at all, and in this application, it seems I might not need it.

So in this dummed down version, it appears they are providing Javascript to replace some of the API calls. So to start, I'd like to see if their
script works with a dollar amount that I can provide from a variable, instead of a hard-coded amount.

Since the function accepts an object (all the code in the curly braces) can I just do something like stick in a variable "amt" before the object definition:

paypal.Buttons(wamt, {...} ).render.('#paypal-button-container');  

Answer 5

@Bruce (SqlWork.com) - way too easy. Thank you! It's so easy I didn't think of it.
If you ever offer tutorials online, you could make money cuz I'd pay to
learn from you!

Thanks again.