javascript - 已发布变量在 Razorpay 支付脚本上的行为不同

Question

我正在尝试通过表单将客户和产品详细信息发布到 Razorpay。但是，它不会触发与我在接收文件中具有相同变量时相同的结果。代码应该是 self 解释的；

表格

<form action="razorpay/index.php" method="POST">
Name: <input type="text" name="cname" required><br>
Phone : <input type="phone" name="cphone" required><br>
Email : <input type="email" name="cemail" required><br>
Address : <textarea cols="50" rows="10" name="caddress" required></textarea>
<input type="hidden" name="gtotal" value="<?php echo $gtotal;?>">
<input type="hidden" name="vcomp" value="<?php echo $vcomp;?>">
<input type="hidden" name="proddescr" value="<?php echo $proddescr;?>">
<input type="submit" name="prodetsub">

接收发布变量的 PHP 文件

<?php 

// If the below variables are not commented, the script works fine with the values

/*$_POST['prodetsub']="submit";
$_POST['gtotal']=8000;
$_POST['vcomp']="Chalo Bazaar";
$_POST['proddescr']="Product Description";
$_POST['cname']="Customer Name";
$_POST['cemail']="customer@email.com";
$_POST['caddress']="Customer Address, Line 1, Line 2, Line 3";
$_POST['cphone']="9999999999";
*/

///But if I try to receive the variables from the post as below, the variables are not passed to javascript and alerted.

if(isset($_POST['prodetsub'])){?>
<form action="charge.php" method="POST">
<?php 
$gtotal=trim($_POST['gtotal']);
$vcomp=trim($_POST['vcomp']);
$proddescr=trim($_POST['proddescr']);
$cname=trim($_POST['cname']);
$cemail=trim($_POST['cemail']);
$caddress=trim($_POST['caddress']);
$cphone=trim($_POST['cphone']);
echo $cname."<br>"; 
echo $cemail."<br>"; 
echo $cphone."<br>"; 
echo $caddress."<br>"; 
echo $gtotal."<br>"; 
echo $vcomp."<br>"; 
echo $proddescr."<br>"; 
?>
<button id="rzp-button1">Pay</button>
<script src="https://checkout.razorpay.com/v1/checkout.js"></script>
<script>
var x=<?php echo $gtotal;?>;
var mn="<?php echo $vcomp;?>";
var d="<?php echo $proddescr;?>";
var cn="<?php echo $cname;?>";
alert(cn);
    var cem="<?php echo $cemail;?>";
    alert(cem);
    var cadd="<?php echo $caddress;?>";
    alert(cadd);
    var cph="<?php echo $cphone;?>";
    alert(cph);

var options = {
"key": "rzp_test_WyK93y9mvps7SN",
"amount": x, // 2000 paise = INR 20
"name": mn,
"description": d,
"image": "../images/logo.png",
"handler": function (response){
    alert(response.razorpay_payment_id);
},
"prefill": {
    "name": cn,
    "email": cem,
    "contact":cph
},
"notes": {
    "address": cadd
},
"theme": {
    "color": "#F37254"
}
};
var rzp1 = new Razorpay(options);

document.getElementById('rzp-button1').onclick = function(e){
rzp1.open();
e.preventDefault();

}
</script>
  <input type="hidden" name="shopping_order_id" value="21">

</form>
<?php } else{echo "Nothing Submitted<br>";}?>

变量在这两种情况下都完美呼应。但是当它来自表单时，它们不会传递给 javascript。因此它不会触发 javascript 中的警报。但是，当我激活顶部注释掉的变量并在同一个文件中分配值时，它起作用了

我想这是我遗漏的一个小问题。但是我花了很多时间去想，却迷失了方向。希望有人能看到我哪里出错了。

编辑:

我现在已经对变量进行了 json_encoded。

源代码显示值正确输出如下

var x="30250";
var mn=""Chalo Bazaar"";
var d=""Unicorn Silver Colour. 4 Year old. In good Condition"";

    var cn=""Anit Gopinath"";
    alert(cn);
    var cem=""anitgopinath@gmail.com"";
    alert(cem);
    var cadd=""506\/C2, Panchganga,\r\nLok Upvan, Phase I, Pokhran II"";
    alert(cadd);
    var cph=""9833157945"";
    alert(cph);

Chrome javascript 控制台报错

“index.php:8 未捕获的语法错误:意外的标识符”

我想知道是否是地址中的斜杠导致 javascript 崩溃

Answer 1

您提到 alert 窗口不工作，这通常发生在 javascript 代码出错时。我们必须找出错误是什么。在浏览器中打开 javascript 控制台(在 Mozilla Firefox 中为 F12 键)。

哦，错误是 double double 引号!因此，为了修复它，我们可以删除 json_encode 调用，或者我们可以删除 javascript 双引号。

成功了吗？伟大的。很高兴为您提供帮助。