使用Ajax在循环中填充表单字段

第一行仅适用于我的行。

<?PHP for ($i = 1; $i <= 20; $i++){ ?>
            <div id="lines" class="row">
                <div class="col-sm-1" style="text-align:left;border:1px solid #808080"><span id="row_number"><?PHP if ( $i < 10 ){ echo "0".$i;}else{echo $i;} ?></span></div>
                <div class="col-sm-2" style="text-align:left;border:1px solid #808080">
                    <select id="part_number" style="border:0px;">
                        <option value="None Selected"></option>
                        <?PHP
                            $partNumbers = $wpdb->get_results("SELECT * FROM _cif_inventory_table;");
                                foreach ($partNumbers as $partNumber) {
                                    echo '<option value="'.$partNumber->part_number.'">'.$partNumber->part_number.'</option>';
                                }
                        ?>
                    </select>
                </div>
                <div class="col-sm-1" style="text-align:left;border:1px solid #808080"><input size="5" maxlength="5" id="quantity" value="" /></div>
                <div class="col-sm-6" style="text-align:left;border:1px solid #808080"><input size="75" id="description-<?PHP echo $i; ?>" value="" /></div>
                <div class="col-sm-1" style="text-align:left;border:1px solid #808080"><input id="unitPrice-<?PHP echo $i; ?>" /></div>
                <div class="col-sm-1" style="text-align:left;border:1px solid #808080"><input id="amount" value="" /></div>
            </div><!-- end .row -->
        <?PHP } ?>

我很确定是id不能正常工作, 因为它们都一样, 所以我决定将循环计数器添加到我的id <input size =” 75″ id =” description-<？PHP echo $ i ;？>” value =”” />和<input id =” unitPrice-<？PHP echo $ i;？>” />, 但我对如何在Ajax端获取此内容感到困惑, 我尝试这样做

更新

    $.ajax({
    url: '<?PHP echo admin_url('admin-ajax.php'); ?>', type: 'post', data: { action: 'description', part_number: part_number }, success: function(data) {

        for ( var i = 1; i <= 20; i++ ) {
          $('#description-' + i).val( data );
        }
    }
    });

但这会填充第1行下拉菜单中的每个说明字段。

#1

首先, 将循环切换为javascript而不是php。

for (var i = 1; i <= 20; i++) {

}

然后, 为ID添加字符串连接。

for (var i = 1; i <= 20; i++) {
    $('#description-' + i).val( data );
}

这就是正确选择HTML元素的方法, 但是, 使用你当前的代码, 所有它们的值都将设置为相同的值。

#2

你应该避免为每一行生成JavaScript。想象一下, 如果每页有100行, 会发生什么情况。你可以在HTML中使用data-value, 然后在js中获取值。这是你的html：

<input type="text" data-name="test" data-value="123" data-id="123" class="myinput"/>

这可以是你的js：

$(".myinput").click(function(){
   var name=$(this).data("name");
   var value=$(this).data("value");
   var id=$(this).data("id");
});

来源：

https://www.srcmini02.com/65703.html

#1

#2

猜你喜欢