This is from Stipe documentation, it charges $20.00. My question is, if I have an item charging $20.00, but I may also have an $5.00 addon item that user can choose by clicking a checkbox. So the charge amount could be $20 or $25. How can I implement that?
<form action="/charge" method="POST">
<script
src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="pk_test_6pRNASCoBOKtIshFeQd4XMUh"
data-image="/img/documentation/checkout/marketplace.png"
data-name="Stripe.com"
data-description="2 widgets"
data-amount="2000">
</script>
</form>
You can use the custom method instead of simple method by following reference page
https://stripe.com/docs/checkout#integration-custom
Related
My Stripe Form isn't showing properly. Here is the screenshot.
I included the stripe script tag in my head tag. Added the form and the css and javascript per instructions in stripe docs.
I thought maybe some other links or scripts are overwriting the stripe script so I tried to uncomment them, but nothing changed the stripe form.
I also made sure than my classes aren't overwriting each other.
<head>
...
<!-- Stripe -->
<script src="https://js.stripe.com/v3/"></script>
...
</head>
<body>
...
<form action="/charge" method="post" id="payment-form">
<div class="form-row">
<label for="card-element">
Credit or debit card
</label>
<div id="card-element">
<!-- A Stripe Element will be inserted here. -->
</div>
<!-- Used to display form errors. -->
<div id="card-errors" role="alert"></div>
</div>
<button>Submit Payment</button>
</form>
...
</body>
Figured it out. I just ended up making my own styles tho it took some time.
Hi – I'm looking for a simple script I can Copy&Paste into my website so I can start selling with BlueSnap's HPF fields.
The form should include the most basic elements needed to get the token back and charge the shopper, I'm not looking for any design, just functionality.
I have the basics - but I need to see how this would look like if it was done:
<form id="checkoutForm">
<div>
<label>Full Name:</label>
<input type="text" id="fullName">
</div>
<div>
<label>Card Number:</label>
<input type="text" id="cardNumber" data-bluesnap="ccn">
</div>
<div>
<label>Security Code:</label>
<input type="text" id="securityCode" data-bluesnap="cvv">
</div>
<div>
<label>Expiration Date (MM/YYYY):</label>
<input type="text" id="expirationDate" data-bluesnap="exp">
</div>
<button type="submit" id="buynowButton">Buy Now</button>
</form>
Can anyone help me with that?
In order to implement BlueSnap Hosted Payment fields all you need to do is
plnkr simple example link
Obtain the Hosted Payment Field token for the session
Add the BlueSnap JavaScript file to your checkout form
<script type="text/javascript" src="BLUESNAPDOMAINPATH/services/hosted-payment-fields/v2.0/bluesnap.hpf.min.js"></script>
Add the Hosted Payment Fields to your checkout form
<div data-bluesnap="ccn"></div>
<div data-bluesnap="exp"></div>
<div data-bluesnap="cvv"></div>
Add a script to initiate the Hosted Payment Fields with your Hosted Fields token
Add a script to submit credit card, expiration date and CVV data
Using Stripes simple 'Checkout', is there a way to show a field for address_line2? When data-billingaddress="true" the popup form only shows one field for the customer's address.
<form action="charge.php" method="post">
<script src="https://checkout.stripe.com/checkout.js" class="stripe-button"
data-key="test-key-goes-here"
data-name="My Site Name"
data-description="my product description"
data-amount="5000"
data-image="https://stripe.com/img/documentation/checkout/marketplace.png"
data-locale="auto"
data-billingaddress="true"
data-shippingaddress="false"
data-currency="gbp">
</script>
</form>
There is not a way to accept address_line2 in Checkout.
If you'd like to collect this field, I'd recommend using Elements, which allows a param to be passed in as part of stripe.createToken
https://stripe.com/docs/stripe.js#stripe-create-token
I'm new to Keystone, but have been trying all day to find the currently logged in user name but I'm not clear how to do this.
If I take the index view from keystone for example
{{!< default}}
<div class="container">
<div class="jumbotron"><img src="/images/logo.svg" width="160">
<h1>Welcome</h1>
<p>This is your new <a href='http://keystonejs.com' target='_blank'>KeystoneJS</a> website.</p>
<p>
It includes the latest versions of
<a href='http://getbootstrap.com/' target='_blank'>Bootstrap</a>
and <a href='http://www.jquery.com/' target='_blank'>jQuery</a>.
</p>
<p>Visit the <a href='http://keystonejs.com/guide' target='_blank'>Getting Started</a> guide to learn how to customise it.</p>
<hr>
<p>We have created a default Admin user for you with the email <strong>masterofimps#yahoo.co.uk</strong> and the password <strong>admin</strong>.</p>
<p>Sign in to use the Admin UI.</p>
<hr>
<p>
Remember to <a href='https://github.com/keystonejs/keystone' target='_blank'>Star KeystoneJS on GitHub</a> and
<a href='https://twitter.com/keystonejs' target='_blank'>follow #keystonejs</a> on twitter for updates.
</p>
</div>
</div>
and I want to add the user name to the view code somthing like
<h1>Welcome Tim</h1>
I have tried
<h1>Welcome {{locals.user}}</h1>
<h1>Welcome {{locals.user.name}}</h1>
<h1>Welcome {{req.user}}</h1> (using an Express request)
But to no avail. How do I find the user name from the User model? Do I have to define something else in the ..\routes\views first?
If anyone could help with an example or pointer in the right direction, Id be very grateful indeed!
If you used the Yeoman generator, one of the middleware functions included (initLocals) sets the current user to a local variable.
res.locals.user = req.user;
https://github.com/keystonejs/generator-keystone/blob/master/app/templates/routes/_middleware.js#L27
You don't need to include locals before the variable name in Handlebars. So remove it in order to get the current user information.
{{user}}
{{user.name}}
There will be a computer on display which users will write in their name, phone number, email and other information. We dont want users going back a page and grabbing ppls emails or other information.
How do i make it so when someone hits back the form no longer shows and a "sorry return to the first page" kind of thing. Theres a small chance there may be an agreement screen so hitting back and submitting another form and no seeing the screen may be trouble but i am not worried about that (or can say please put them on the same page).
I know its been asked but i havent seen any with this reason and the solutions i saw did not work (on firefox 3.6.10)
A little web searching found this page: Clear Web Forms After Submit
Basically calls the reset() function on all forms on the <body> tag's onload and unload events.
Code from the link:
<html>
<head>
<title>A Self-Clearing Form</title>
<script>
function clearForms()
{
var i;
for (i = 0; (i < document.forms.length); i++) {
document.forms[i].reset();
}
}
</script>
</head>
<body onLoad="clearForms()" onUnload="clearForms()">
<h1>A Self-Clearing Form</h1>
This form data will self-destruct when you leave the current web page.
<form method="post" action="page2.php" name="test">
<input name="field1"/> Field One
<p>
<input name="field2" type="radio" value="One"/>One
<input name="field2" type="radio" value="Two"/>Two
<input name="field2" type="radio" value="Three"/>Three
<input name="field2" type="radio" value="Four"/>Four
<p>
<input type="submit" value="Submit Form Data"/>
</form>
</body>
</html>
When the users enter information, save it and then send a redirect (through headers) to the page where users can enter their info.
Could have the form displayed as a result of a POST call, meaning the browser won't cache it. Then, if another user hits back, the browser will ask if they want to resend the request, but even if they do, you display them a blank page.