如何通过 JSON 发送选定的单选按钮

Question

我正在创建一个 REST API，它将通过 POST 接收 JSON 数据。我现在正在创建 JSON 的结构，想知道如何发送数据以表示在发送方选择了哪个单选按钮的最佳实践是什么。我想到了 3 种可能的方法，但如果有更好的方法，我愿意接受其他选择。以下是 UPS、FedEx 和 USPS 作为示例选项的 3 种方式：

“UPS”：错误， “联邦快递”：是的， “USPS”：错误

"ShippingCompany": 2 // UPS 1 个，FedEx 2 个，USPS 3 个

“货运公司”：“联邦快递”

Answer 1

你可以通过querySelector轻松获取：

let el = document.querySelector("input[name=radioName]:checked");
let val = el !== null ? el.value : "";

在你的 json 中你使用像：

json = {
     radioName: val 
}

然后，到 post，也许您可能需要对 json 进行字符串化。这是使用 Fetch Api 并从后端接收 json 的示例代码。

const getAllIncidents = () => { var reqHeaders = new Headers();

            var reqInit = { method: 'GET',   
               headers: reqHeaders,
               mode: 'cors',
               cache: 'default' ,
               body: JSON.stringify( { 
                    radioName: val 
                })
               };
            fetch(service_url, reqInit)
            .then( r => {
                return r.json();
            }).then( json => {
                console.log(json);
            });
        }

Obs 1.: querySelector returns 如果选择器 returns 没有元素则为 null。 Obs 2.: 请记住为单选按钮集合使用相同的名称，并为每个单选按钮使用不同的 ID。

Answer 2

这取决于用例以及谁在使用 API。

您的第一个解决方案是这三个解决方案中最不受欢迎的一个，因为您想要实现一个单选按钮。这更像是一个复选框的情况。

变体 2 和 3 可以互换，但我会使用 3，因为很明显你指的是什么公司，而不必查找整数的含义。

要更进一步，您可以查看 openapi 中的枚举及其定义。

如何通过 JSON 发送选定的单选按钮

How to send selected Radio Button through JSON

rest

post

json