javascript - PHP MySQL PayPal 集成 - 除非手动输入金额,否则 PayPal 按钮不起作用
问题描述
预先声明金额值时,单击“使用 PayPal 付款按钮”时没有任何反应。但是,当我手动编辑金额时,PayPal 按钮突然起作用。
输入字段如下所示:
<input name="amountInput" type="number" id="amount" value="'.$amount.'">
以下是我从数据库中获取变量的方法:
$gymid = $row['gymID'];
$status = $row['status'];
$now = date("Y-m-d h:i:s");
$date1 = $row['start_event'];
$date2 = $row['end_event'];
$date1format = date_create($row['start_event']);
$date2format = date_create($row['end_event']);
$diff = abs(strtotime($date1) - strtotime($date2));
$years = floor($diff / (365*60*60*24));
$months = floor(($diff - $years * 365*60*60*24) / (30*60*60*24));
$days = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24)/ (60*60*24));
$hours = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24) / (60*60));
$minutes = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24 - $hours*60*60)/ 60);
$seconds = floor(($diff - $years * 365*60*60*24 - $months*30*60*60*24 - $days*60*60*24 - $hours*60*60 - $minutes*60));
我采取这样的金额:
$rate = $row2['gymRate'];
$amount = $hours * $rate;
整个脚本如下所示:
<script>
function initPayPalButton() {
var description = document.querySelector('#smart-button-container #description');
var amount = document.querySelector('#smart-button-container #amount');
var descriptionError = document.querySelector('#smart-button-container #descriptionError');
var priceError = document.querySelector('#smart-button-container #priceLabelError');
var invoiceid = document.querySelector('#smart-button-container #invoiceid');
var invoiceidError = document.querySelector('#smart-button-container #invoiceidError');
var invoiceidDiv = document.querySelector('#smart-button-container #invoiceidDiv');
var elArr = [description, amount];
if (invoiceidDiv.firstChild.innerHTML.length > 1) {
invoiceidDiv.style.display = "block";
}
var purchase_units = [];
purchase_units[0] = {};
purchase_units[0].amount = {};
function validate(event) {
return event.value.length > 0;
}
paypal.Buttons({
style: {
color: 'gold',
shape: 'pill',
label: 'pay',
layout: 'horizontal',
},
onInit: function (data, actions) {
actions.disable();
if(invoiceidDiv.style.display === "block") {
elArr.push(invoiceid);
}
elArr.forEach(function (item) {
item.addEventListener('keyup', function (event) {
var result = elArr.every(validate);
if (result) {
actions.enable();
} else {
actions.disable();
}
});
});
},
onClick: function () {
if (description.value.length < 1) {
descriptionError.style.visibility = "visible";
} else {
descriptionError.style.visibility = "hidden";
}
if (amount.value.length < 1) {
priceError.style.visibility = "visible";
} else {
priceError.style.visibility = "hidden";
}
if (invoiceid.value.length < 1 && invoiceidDiv.style.display === "block") {
invoiceidError.style.visibility = "visible";
} else {
invoiceidError.style.visibility = "hidden";
}
purchase_units[0].description = description.value;
purchase_units[0].amount.value = amount.value;
if(invoiceid.value !== '') {
purchase_units[0].invoice_id = invoiceid.value;
}
},
createOrder: function (data, actions) {
return actions.order.create({
purchase_units: purchase_units,
});
},
onApprove: function (data, actions) {
return actions.order.capture().then(function (details) {
});
},
onError: function (err) {
console.log(err);
}
}).render('#paypal-button-container');
}
setInterval(function(){
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("GET","response.php",false);
xmlhttp.send(null);
var timer = document.getElementById("response").innerHTML=xmlhttp.responseText;
//refreshes the table in the page once the timer expires
if(timer == "00:00"){
window.location.reload(true);
}
}, 1000);
initPayPalButton();
</script>
显然,金额输入字段应该被禁用以防止用户编辑。
解决方案
我通过更改解决了这个问题:
onInit: function (data, actions) {
actions.disable();
至:
onInit: function (data, actions) {
actions.enable();
推荐阅读
- ajax - JSF2 - SelectOneMenu 在第一次 setter 调用后“挂起”
- arduino - Arduino 将值从 file.read() 转换为 const char*
- json - 如何通过命令行或手动将 json 文件数据加载到现有的 couchbase 存储桶中?
- angular - 如何从详细信息页面Angular 9中的单个对象(本地JSON)获取详细信息
- sql - 存储过程不适用于动态 where 子句
- css - 字体显示在桌面但不在移动设备上
- c++ - C++ Expat 仅打印标签中元素和数据的首字母
- windows-10 - 为什么在社交媒体上从我的网站共享链接时会显示本地 IP 地址?
- css - Ionic React 不能在 IonItem 中使用 flexbox 或加载外部 .css
- r - ggplot2中具有多个标签/信息的饼图