javascript - 如何使用 jquery 更改连接到动态表单中的选择更改的值?

标签 javascript php jquery html ajax

我试图制作一个表单,它有两个元素,一个选择项目和一个输入价格,选择选项存储在数据库中,所以我检索它并显示它。

单击添加按钮时,用户可以添加具有相同元素的新行,当更改选择选项时,我使用 ajax 从数据库中获取价格并将其显示在文本输入中。

第一行一切正常,但是当用户添加新行时,我无法检索价格并收到以下消息

"the specified value "NaN" is not a valid number. The value must match to the following regular expression: -?(\d+|\d+.\d+|.\d+)([eE][-+]?\d+)?"

我该如何解决这个问题,或者是否有另一种方法可以使用行 ID 更改输入的值

<table id="tab_logic">
    <tr id='row0'>
        <td>1</td>
        <td>
            <select class="form-control item" name="item[]" required>
            <?php 
                $items = "SELECT itemCode, itemName FROM items";
                $itemslist = $conn->query($items);
                while($row = $itemslist->fetch_assoc()) {
                    echo "<option value='" . $row["itemCode"] . "'>" . $row["itemName"]. "</option>" ;
                }
            ?>
            </select>
        </td>
        <td>
            <input type="text" name='price[]' class="form-control price" required/>
        </td>
    </tr>
    <tr id='row1'></tr>
</table>
<button id="add_row" class="btn btn-default">Add Row</button>

<script>

function get_price(sel, item) 
{
    $.ajax({
        type: "POST",
        url : "getData.php",
        data: {itemCode: sel },
        success: function(data) {
            $(item).find("input").val(data.price) 
        },
    }); 
}

$(document).ready(function(){
    //add new row when add buttomn clicked 
    var i = 1;

    $("#add_row").click(function(){
        var a = i-1;

        $('#row' + i).html( $('#row' + a).html() )
                   .find('td:first-child')
                   .html(i+1);
        $('#tab_logic').append('<tr id="row' + (i+1) + '"></tr>');
        i++; 
    });

    //when selected item change get parent and call function 
    $('#tab_logic select').on('change', function() {
        var item = $(this).parent().parent();

        get_price(this.value, item);
    });

});

</script>

最佳答案

我终于解决了,问题是 get_price 只在第一次更改时被调用一次,所以我通过调用函数 onclick 使用这种方式解决了它

    <select class="form-control item" name="item[]" onclick="get_price(this.value,$(this).parent().parent());" id='1' required>

关于javascript - 如何使用 jquery 更改连接到动态表单中的选择更改的值?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/52606977/

相关文章:

javascript - 如何将字符串 2010-1-10 转换为 javascript 中的日期对象?

javascript - $index 的 formElementsData 跟踪中的 Angular ng-repeat 错误 "Duplicates in a repeater are not allowed' 和 (k, v) 不起作用

php - 无法从数据库中提取 ID

php - 使用 PHP 站点的 NODE JS 的特定页面需要 SSL

javascript - 将选定的行从 html 表加载到数组

javascript - 如何在 jquery 中使用子对象 $.extend 对象?

javascript - JQuery 追加点击

javascript - 当 JavaScript 函数的名称作为字符串传递到函数中时,如何执行该函数?

javascript - Angularjs 中函数的参数神奇地匹配?

javascript - 我如何知道我的文档中有多少 <a> 标签