错误所有产品在修改输入字段时更新

Question

我有几个输入字段，允许我添加或更新添加到购物车的产品的折扣：

<div class="bsk-dto">
    <input type="text" name="dtoupdate[3][Normal][Normal][Normal][1][%]" value="3" class="dto" autocomplete="off" data-validation="number" data-validation-allowing="float">
</div>
<div class="bsk-dto">
    <input type="text" name="dtoupdate[6][Normal][Normal][Normal][1][%]" value="1" class="dto" autocomplete="off" data-validation="number" data-validation-allowing="float">
</div>
<div class="bsk-dto">
    <input type="text" name="dtoupdate[10][Normal][Normal][Normal][1][%]" value="0" class="dto" autocomplete="off" data-validation="number" data-validation-allowing="float">
</div>

此数据是根据添加到购物车的项目生成的：

我在我的 ajax 代码中添加了 $this 属性，这样当其中一些被修改时，它只会更新正在修改的输入字段，但不幸的是它对我不起作用，如果我修改其中一个输入字段，所有其中有修改。

$(function() {
    $(document).on('input', '.dto', function(e){
        e.preventDefault();
        $this = $(this);
        var formData = [];
        $('input[name^="dtoupdate"]').each(function() {
            formData.push(this.value);
        });

        var formData = $(this).serializeArray();

        var url = "update_cart.ini.php";

        $.ajax({
            url: url,
            type: "POST",
            data: formData,
            cache: false,
        })
        .done(function(data) {
            let res = JSON.parse(data);
            if(res.status){
                $('.alert-success').fadeIn();
                $('.alert-success').html(res.message).delay(2000).fadeOut(2000);
            } else {
                $('.alert-danger').fadeIn();
                $('.alert-danger').html(res.message).delay(2000).fadeOut(2000);
            }
        })
        .fail(function( jqXHR, textStatus ) {
            /*alert("Ajax Request fail");
            console.log(jqXHR.responseText);
            console.log("Request failed: " + textStatus );*/
        })
    });
});

我应该做哪些更改，以便它只更新正在修改的输入中的数据？

Answer 1

试试这个只发送一个字段

const field = {}; 
field[this.name] = this.value; 

$.ajax({
  url: url,
  methodd: "POST",
  data: field,