I'm developing a payment plugin for Paymill. Paymill uses a javascript bridge to generate a token to send along with the payment information. I've got everything working for the regular checkout process (multi page). However, when I switch to using the one page check out, it appears to strip all of the javascript from the payment info view.
Can someone help me figure out how (without altering anything but the plugin project, I want to make this plugin available to everyone) to keep the js from disappearing on the one page checkout?
Payment plugin / One page checkout / javascript
MVP
- 2134
- 19323
- 11/6/2009
- Malaysia
tfsmag wrote:
Are you referencing the JS from a separate source (as in not inline script)? :)
I'm developing a payment plugin for Paymill. Paymill uses a javascript bridge to generate a token to send along with the payment information. I've got everything working for the regular checkout process (multi page). However, when I switch to using the one page check out, it appears to strip all of the javascript from the payment info view.
Can someone help me figure out how (without altering anything but the plugin project, I want to make this plugin available to everyone) to keep the js from disappearing on the one page checkout?
Can someone help me figure out how (without altering anything but the plugin project, I want to make this plugin available to everyone) to keep the js from disappearing on the one page checkout?
Are you referencing the JS from a separate source (as in not inline script)? :)
- 40
- 450
- 11/28/2011
- United States
It's definitely stripping out my javascript, I'd like to know where that is happening
digging a little deeper I wonder if it's because the button for saving the payment info and moving to the next step contains an "onclick" event. My paymill js is capturing the "submit" event of that button, but if it's executing an onclick, even if the js I had written for the paymill interaction would never get hit.
digging a little deeper I wonder if it's because the button for saving the payment info and moving to the next step contains an "onclick" event. My paymill js is capturing the "submit" event of that button, but if it's executing an onclick, even if the js I had written for the paymill interaction would never get hit.
$(document).ready(function () {
function PaymillResponseHandler(error, result) {
if (error) {
// Zeigt den Fehler überhalb des Formulars an
$(".payment-errors").text(error.apierror);
} else {
$(".payment-errors").text("");
var form = $(".payment-info-next-step-button").closest('form');
// Token
var token = result.token;
// Token in das Formular einfügen damit es an den Server übergeben wird
$("#paymenttoken").val(token);
form.get(0).submit();
}
$(".payment-info-next-step-button").removeAttr("disabled");
}
$(".payment-info-next-step-button").closest('form').submit(function (event) {
// Absenden Button deaktivieren um weitere Klicks zu vermeiden
$('.submit-button').attr("disabled", "disabled");
if (false == paymill.validateCardNumber($('.card-number').val())) {
$(".payment-errors").text(@T("PaymentInfo.InvalidCard"));
$(".payment-info-next-step-button").removeAttr("disabled");
return false;
}
if (false == paymill.validateExpiry($('.card-expiry-month').val(), $('.card-expiry-year').val())) {
$(".payment-errors").text(@T("PaymentInfo.ExpiredCard"));
$(".payment-info-next-step-button").removeAttr("disabled");
return false;
}
paymill.createToken({
number: $('.card-number').val(),
exp_month: $('.card-expiry-month').val(),
exp_year: $('.card-expiry-year').val(),
cvc: $('.card-cvc').val(),
cardholdername: $('.card-holdername').val(),
amount_int: $('.amount').val(),
currency: $('.currency').val()
}, PaymillResponseHandler);
return false;
});
});
MVP
- 2134
- 19323
- 11/6/2009
- Malaysia
tfsmag wrote:
Why do you use closest by the way? I don't see it conform to the DOM (or am I missing anything?). :D
It's definitely stripping out my javascript, I'd like to know where that is happening
digging a little deeper I wonder if it's because the button for saving the payment info and moving to the next step contains an "onclick" event. My paymill js is capturing the "submit" event of that button, but if it's executing an onclick, even if the js I had written for the paymill interaction would never get hit.
digging a little deeper I wonder if it's because the button for saving the payment info and moving to the next step contains an "onclick" event. My paymill js is capturing the "submit" event of that button, but if it's executing an onclick, even if the js I had written for the paymill interaction would never get hit.
$(document).ready(function () {
function PaymillResponseHandler(error, result) {
if (error) {
// Zeigt den Fehler überhalb des Formulars an
$(".payment-errors").text(error.apierror);
} else {
$(".payment-errors").text("");
var form = $(".payment-info-next-step-button").closest('form');
// Token
var token = result.token;
// Token in das Formular einfügen damit es an den Server übergeben wird
$("#paymenttoken").val(token);
form.get(0).submit();
}
$(".payment-info-next-step-button").removeAttr("disabled");
}
$(".payment-info-next-step-button").closest('form').submit(function (event) {
// Absenden Button deaktivieren um weitere Klicks zu vermeiden
$('.submit-button').attr("disabled", "disabled");
if (false == paymill.validateCardNumber($('.card-number').val())) {
$(".payment-errors").text(@T("PaymentInfo.InvalidCard"));
$(".payment-info-next-step-button").removeAttr("disabled");
return false;
}
if (false == paymill.validateExpiry($('.card-expiry-month').val(), $('.card-expiry-year').val())) {
$(".payment-errors").text(@T("PaymentInfo.ExpiredCard"));
$(".payment-info-next-step-button").removeAttr("disabled");
return false;
}
paymill.createToken({
number: $('.card-number').val(),
exp_month: $('.card-expiry-month').val(),
exp_year: $('.card-expiry-year').val(),
cvc: $('.card-cvc').val(),
cardholdername: $('.card-holdername').val(),
amount_int: $('.amount').val(),
currency: $('.currency').val()
}, PaymillResponseHandler);
return false;
});
});
Why do you use closest by the way? I don't see it conform to the DOM (or am I missing anything?). :D
- 40
- 450
- 11/28/2011
- United States
What would you suggest besides closest? The form on the regular checkout has no id or anything to refer to specifically. It was the best way to get the submitting form into a variable in the javascript code.
closest also stops when it finds a match, as opposed to the parents method which will traverse the whole tree and then filter the results.
http://api.jquery.com/closest/
regardless, I don't think my using closest is causing nopcommerce to strip javascript out of the page :)
closest also stops when it finds a match, as opposed to the parents method which will traverse the whole tree and then filter the results.
http://api.jquery.com/closest/
regardless, I don't think my using closest is causing nopcommerce to strip javascript out of the page :)
- 40
- 450
- 11/28/2011
- United States
Just for fun I edited the "Manual" payment method project and inserted a bit of js <script type="text/javascript">var test="test";</script> into it's paymentinfo.cshtml file and sure enough, after I made it the payment method and attempted to use the one page checkout it stripped that javascript out too.
MVP
- 2134
- 19323
- 11/6/2009
- Malaysia
tfsmag wrote:
When you say it strips off, are you viewing through View Source or the Developer Tool (sounds stupid but just to make sure)? I can't think of a reason why it strips off JS yet, probably due to AJAX? (Need to think harder, might have missed something!)
You can just select 2 sets of form differently. One by #co-payment-info-form and another by .payment-info form.
What would you suggest besides closest? The form on the regular checkout has no id or anything to refer to specifically. It was the best way to get the submitting form into a variable in the javascript code.
closest also stops when it finds a match, as opposed to the parents method which will traverse the whole tree and then filter the results.
regardless, I don't think my using closest is causing nopcommerce to strip javascript out of the page :)
closest also stops when it finds a match, as opposed to the parents method which will traverse the whole tree and then filter the results.
regardless, I don't think my using closest is causing nopcommerce to strip javascript out of the page :)
When you say it strips off, are you viewing through View Source or the Developer Tool (sounds stupid but just to make sure)? I can't think of a reason why it strips off JS yet, probably due to AJAX? (Need to think harder, might have missed something!)
You can just select 2 sets of form differently. One by #co-payment-info-form and another by .payment-info form.
MVP
- 2134
- 19323
- 11/6/2009
- Malaysia
wooncherk wrote:
And just to make sure the original onclick event is not overriding anything, perhaps you can overtake it, and call PaymentInfo.save() inside your very own method? http://stackoverflow.com/questions/2629916/how-do-you-override-inline-onclick-event
What would you suggest besides closest? The form on the regular checkout has no id or anything to refer to specifically. It was the best way to get the submitting form into a variable in the javascript code.
closest also stops when it finds a match, as opposed to the parents method which will traverse the whole tree and then filter the results.
regardless, I don't think my using closest is causing nopcommerce to strip javascript out of the page :)
When you say it strips off, are you viewing through View Source or the Developer Tool (sounds stupid but just to make sure)? I can't think of a reason why it strips off JS yet, probably due to AJAX? (Need to think harder, might have missed something!)
You can just select 2 sets of form differently. One by #co-payment-info-form and another by .payment-info form.
closest also stops when it finds a match, as opposed to the parents method which will traverse the whole tree and then filter the results.
regardless, I don't think my using closest is causing nopcommerce to strip javascript out of the page :)
When you say it strips off, are you viewing through View Source or the Developer Tool (sounds stupid but just to make sure)? I can't think of a reason why it strips off JS yet, probably due to AJAX? (Need to think harder, might have missed something!)
You can just select 2 sets of form differently. One by #co-payment-info-form and another by .payment-info form.
And just to make sure the original onclick event is not overriding anything, perhaps you can overtake it, and call PaymentInfo.save() inside your very own method? http://stackoverflow.com/questions/2629916/how-do-you-override-inline-onclick-event