Is it possible to pay with credit cards with an own form or what is the best way to implement that?
Something like that:
Customer add a product to the cart
Customer fills his customer informations (myshopdomain.com/cart/customerinformations)
The customer see his order and accept it (myshopdomain.com/cart/accept)
Tea Commerce send him to myshopdomain.com/cart/payment => Here we haven't any popup/redirect like paypal/sagepay/... also we have an own form, the customer enter his credit card informations and we will send that to the payment provider
Redirect if success to myshopdomain.com/cart/confirmation
The way to do it is to make your own payment provider for Tea Commerce - as your system will act as a provider. If you email me ( info [(at)] teacommerce.dk ) I can send you some examples of our out of the box payment providers. You will then have to have a page that show the card input fields to the customer. When the customer then click "Pay" you will have to validate the card info and all that. You will then have info about a continue, cancel and callback url from the Form post data that Tea Commerce has send you. You will then have to call those url's based on the data the customer enters. And then again the payment provider you will create will be activated by the Tea Commerce code and do the right things for the continue, cancel and callback url ( you will have to code those methods in your payment provider )
within the js file's jQuery("#cart.stepProgress03 #next").live("click", function () event invoked the webservice which handle payment provider integration.
I have an ascx which collect all payment informations from the customer (credit card number, expiry month, expiry year, ...)
Now I have an own payment provider (implements your APaymentProvider) which makes a form.
How can I add the payment informations to the payment provider dictionary (settings) for the form (your GenerateForm method), because the payment provider need them?
What Anders was trying to say was that your flow will look something like this in your cart flow:
Step 1 - Cart information - No magic here
Step 2 - Customer information - Also standard here
Step 3 - Accept - This is where the magic starts: You will use the standard Tea Commerce GetPaymentForm here. The payment provider you have created will deliver all the information for the form. The FormPostUrl in your payment provider should redirect to the step 4 page. What Tea Commerce does when generating the form is to ready the order for payment. This is very Important. In your custom payment providers GenerateForm, you add the payment information to the payment provider dictionary.
Step 4 - Payment- This page is a standard umbraco page with your ascx control embedded. In your ascx control you can get the form information posted by the form and use it in your payment gateway (aka your ascx). This is what regular payment gateways does. The customer will type in his payment information and when submitting the ascx you will check the validity of the payment. If the payment is valid you redirect the user to the continue url. The continue Url is Step5 (Which was provided by the form in step 3) If the payment is invalid you can either handle it in your ascx, or send the customer to the error or cancel url.
So, you mean we will find all necessary informations in the request (POST)? I mean the settings which we entered in the umbraco tea commerce backend (success url, merchant id, etc).
Yes all info you need for your "Enter credit card info" will be posted to your page - so you can use Request.Form[""].
The settings entered for the payment provider in the Tea Commerce admin interface is sent to your payment provider in the GenerateForm, GetContinueUrl, ProcessCallback etc. That will be the only place where it should be necessary.
Sounds great that you make it open source and share it with the rest of the umbraco community. If you write good documentation for the provider we could talk about including it with Tea Commerce or maybe just link from our website. But lets talk about that when you got the provider finished and you site live :)
Now we have one last question. ;-) We already achieved that orders are processed by Datatrans (payment gateway) and the page is redirected to the success url (GetContinueUrl in our new payment provider is firing). But now the order is in an unsatisfying condition (Order status: New / Payment status: Initial / Order stage: Cart).
No further Event is firing (ProcessCallback nor CapturePayment nor something else ?)
What we had to do is submitting the form with JavaScript and replacing the action of the form to the Datatrans specific URL.
What do we have to do to complete the orders at the final step?
When you do the credit card processing by asking Datatrans if the entered credit card info is valid - if you get a "confirm" result you will have to invoke the CallbackUrl or your payment provider - that should also be posted to your credit card site - just like your confinue url and cancel url. Its the callback that will finalize the order from cart to a real order.
Your callback should be a server to server communication - while the continue and cancel url if to redirect the customer back to your webshop site. Do you understand the different between the continue url and callback url? Maybe we should have a small skype call to explain how it should work as its pretty important your payment functions correctly? :)
Could you try and write how you solve your problem and mark it as a solutions for your problem - would help others to find the solution as easy as possible - thanks
We had to override the FinalizeAtContinueUrl method. The ProcessCallback is now fired without calling the call back url explicitly, Thx again for your help.
public override bool FinalizeAtContinueUrl { get { // The ProcessCallback method is called even if it's a redirect to continue url return true; //base.FinalizeAtContinueUrl; } }
Payment provider with own form
Is it possible to pay with credit cards with an own form or what is the best way to implement that?
Something like that:
=> Here we haven't any popup/redirect like paypal/sagepay/... also we have an own form, the customer enter his credit card informations and we will send that to the payment provider
Do you know what i mean ;-)?
Regards
Hi root
The way to do it is to make your own payment provider for Tea Commerce - as your system will act as a provider. If you email me ( info [(at)] teacommerce.dk ) I can send you some examples of our out of the box payment providers. You will then have to have a page that show the card input fields to the customer. When the customer then click "Pay" you will have to validate the card info and all that. You will then have info about a continue, cancel and callback url from the Form post data that Tea Commerce has send you. You will then have to call those url's based on the data the customer enters. And then again the payment provider you will create will be activated by the Tea Commerce code and do the right things for the continue, cancel and callback url ( you will have to code those methods in your payment provider )
Hope it all makes sense :)
Kind regards
Anders
Hi root,
2 weeks before I integrated with paypal payflow pro. Here I'm describing shortly what I did.
Form can be customize in cartStep02.xslt by adding and removing the <tr>
<tr>
<td class="cufonReplace col1">
First name
</td>
<td class="col2">
<div class="textField firstName">
<span>
<xsl:text> </xsl:text>
</span>
<input type="text" id="firstName" class="required" value="{$order/properties/firstName}" />
</div>
</td>
</tr>
Then I made changes in teacommerce_default.js
var formObj = {
"firstName": personalInformation.find("#firstName").val(),
"lastName": personalInformation.find("#lastName").val(),
"cardType": personalInformation.find("#cardType").val(),
"cardNumber": personalInformation.find("#cardNumber").val(),
"date": personalInformation.find("#date").val(),
"cardIdNumber": personalInformation.find("#cardIdNumber").val()
};
within the js file's jQuery("#cart.stepProgress03 #next").live("click", function () event invoked the webservice which handle payment provider integration.
You can find paypal payflow pro example here http://www.codeproject.com/KB/aspnet/PayPal_PayflowPro.aspx
Hope this will help you
Thanks
PTamang
Thanks for your replies.
I have an ascx which collect all payment informations from the customer (credit card number, expiry month, expiry year, ...)
Now I have an own payment provider (implements your APaymentProvider) which makes a form.
How can I add the payment informations to the payment provider dictionary (settings) for the form (your GenerateForm method), because the payment provider need them?
Hi root,
Anders is busy, so I will give it a shot :)
What Anders was trying to say was that your flow will look something like this in your cart flow:
Step 1 - Cart information - No magic here
Step 2 - Customer information - Also standard here
Step 3 - Accept - This is where the magic starts:
You will use the standard Tea Commerce GetPaymentForm here. The payment provider you have created will deliver all the information for the form.
The FormPostUrl in your payment provider should redirect to the step 4 page.
What Tea Commerce does when generating the form is to ready the order for payment. This is very Important.
In your custom payment providers GenerateForm, you add the payment information to the payment provider dictionary.
Step 4 - Payment- This page is a standard umbraco page with your ascx control embedded.
In your ascx control you can get the form information posted by the form and use it in your payment gateway (aka your ascx). This is what regular payment gateways does.
The customer will type in his payment information and when submitting the ascx you will check the validity of the payment.
If the payment is valid you redirect the user to the continue url. The continue Url is Step5 (Which was provided by the form in step 3)
If the payment is invalid you can either handle it in your ascx, or send the customer to the error or cancel url.
Step 5 - Confirmation - Nothing magic here.
Hope this helps
/Rune
Hi root
Did you manage to get anything going?
Kind regards
Anders
So, you mean we will find all necessary informations in the request (POST)?
I mean the settings which we entered in the umbraco tea commerce backend (success url, merchant id, etc).
root and I are trying to add a payment provider for http://pilot.datatrans.biz/showcase/Showcase.jsp?mn=1&gr=2&sb=21
Our final solution will be open source and distributed via our.umbraco.org. ;-)
Hi Tobias
Yes all info you need for your "Enter credit card info" will be posted to your page - so you can use Request.Form[""].
The settings entered for the payment provider in the Tea Commerce admin interface is sent to your payment provider in the GenerateForm, GetContinueUrl, ProcessCallback etc. That will be the only place where it should be necessary.
Sounds great that you make it open source and share it with the rest of the umbraco community. If you write good documentation for the provider we could talk about including it with Tea Commerce or maybe just link from our website. But lets talk about that when you got the provider finished and you site live :)
Kind regards
Anders
Hi Anders,
Now we have one last question. ;-)
We already achieved that orders are processed by Datatrans (payment gateway) and the page is redirected to the success url (GetContinueUrl in our new payment provider is firing). But now the order is in an unsatisfying condition (Order status: New / Payment status: Initial / Order stage: Cart).
No further Event is firing (ProcessCallback nor CapturePayment nor something else ?)
What we had to do is submitting the form with JavaScript and replacing the action of the form to the Datatrans specific URL.
What do we have to do to complete the orders at the final step?
Hi Tobias
When you do the credit card processing by asking Datatrans if the entered credit card info is valid - if you get a "confirm" result you will have to invoke the CallbackUrl or your payment provider - that should also be posted to your credit card site - just like your confinue url and cancel url. Its the callback that will finalize the order from cart to a real order.
We submit following url as the success url http://localhost:49356/tcbase/teacommerce/PaymentContinue/Datatrans/BC69F4FA1E2F1068CD85533706B9D45D.aspx
This url redirects to our final url http://localhost:49356/opten/de/shoppingcard/success/.
Do we have to manually call a javascript function on the last page (success) to invoke the ProcessCallback method?
Now the ProcessCallback is fired - but it does not redirect to success page. Holds on http://localhost:49356/tcbase/teacommerce/PaymentCallback/Datatrans/8A248EB9A414B60FA35FEAC9AB00324E.aspx
Thx so much for your help.
Hi Tobias
Your callback should be a server to server communication - while the continue and cancel url if to redirect the customer back to your webshop site. Do you understand the different between the continue url and callback url? Maybe we should have a small skype call to explain how it should work as its pretty important your payment functions correctly? :)
Hi Tobias
Could you try and write how you solve your problem and mark it as a solutions for your problem - would help others to find the solution as easy as possible - thanks
We had to override the FinalizeAtContinueUrl method. The ProcessCallback is now fired without calling the call back url explicitly,
Thx again for your help.
public override bool FinalizeAtContinueUrl
{
get
{
// The ProcessCallback method is called even if it's a redirect to continue url
return true; //base.FinalizeAtContinueUrl;
}
}
Hi Tobias
Could you mark your own answer as the correct solution? You should see a green check mark at your post.
Kind regards
Anders
There is no such green check mark.
is working on a reply...