如何确保输入整数在表单提交时保持整数

Question

我正在尝试将支付网关集成到我的网站。我需要做的是发送：

{ 
"api_key": "pkabcd12345", 
"currency": "USD", 
"amount": 0.2,
"method": "MOBILE_MONEY",
"provider_id": "airtel_ug", 
"account_number": "256777111000",
"merchant_reference": "12345", 
"narration": "Payment for Hosting",
"redirect_url": ""
}

使用 POST 到 https://api.dusupay.com/v1/collections

我已尝试将其作为 HTML 输入表单发送：

<form method="post" action="https://api.dusupay.com/v1/collections" name="frm1">
<input type="hidden" name="api_key" value="pkabcd12345" required>
<input type="number" name="amount" value='150' required>
<input type="hidden" name="currency" value="USD" required>
<input type="hidden" name="method" value="MOBILE_MONEY" required>
<input type="hidden" name="provider_id" value="airtel_ug" required>
<input type="hidden" name="merchant_reference" value="12346" required>
<input type="hidden" name="narration" value="diamond1" optional>
<input type="hidden" name="redirect_url" value="" optional>
</form>
<button onclick="document.frm1.submit()">Submit</button>

但是应用程序返回一个错误说“参数‘amount’应该是一个浮点数/整数”。

我也尝试过直接通过 html 表单发布 JSON 对象，如下所示：

<form method="post" action="https://api.dusupay.com/v1/collections" name="frm1" >
<input value =  '{ 
"api_key": "pkabcd12345", 
"currency": "USD", 
"amount": 0.2,
"method": "MOBILE_MONEY/CARD/BANK", 
"provider_id": "airtel_ug, mtn_ug", 
"account_number": "256777111000",
"merchant_reference": "12345", 
"narration": "Payment for Hosting",
"redirect_url": ""
}' required>
</form>
<button onclick="document.frm1.submit();">Submit</button>

但它甚至没有通过第一次检查，它会抛出错误“Parameter 'api_key' missing”。

Answer 1

type 属性指定要显示的元素的类型。

即使你将输入的类型设置为数字，表单仍然会以字符串的形式提交，如下面的sn-p所示：

console.log(typeof document.getElementById("yourinput").value)

<input id="yourinput" type="number" name="amount" value='150' required>

这也不是您使用 json 值执行帖子的方式，而是您可以编写自己的函数来执行此操作，例如使用 fetch：

fetch("https://api.dusupay.com/v1/collections", {
    method: 'post',
    body:    JSON.stringify(body),
    headers: { 'Content-Type': 'application/json' },
})
    .then(res=>res.json()) // if the answer is in json format
    .then(console.log)

但这还不是全部，您似乎感到困惑并在您的 JSON 正文中包含了所有不同类型的提供程序和方法，而不是仅针对此特定请求有效的一种。