添加行按钮添加带有Select2选项的PHP单元格

Question

对Q表单感到抱歉，但我找不到更好的解释方法。

我有一个视图表，其下拉形式从要插入的数据库中检索其选项，并且它有一个添加按钮以添加要插入的新行。

但下拉列表适用于Select2表单，并且已包含在表格中，因此每次我尝试添加新行时，都会为其提供相同的 id 上一个与Select2的JS冲突，因为它需要为我用它做的每个下拉列表获得特殊的 id 。

此处有表格和添加按钮代码

<div class="row">
            <div class="table-responsive">
                <table class="table table-bordered" id="tab_logic">
                    <thead>
                        <tr>
                            <th>Brand Name</th>
                            <th>Item Name</th>
                            <th>Model Number</th>
                            <th class="col-md-2">Item Description</th>
                            <th>Part Number</th>
                            <th>Unit</th>
                            <th class="col-md-1">QTY</th>
                            <th class="col-md-1">Unit Price (SR)</th>
                            <th class="col-md-1">Total Price (SR)</th>
                        </tr>
                    </thead>
                    <tbody>
                        <tr>
                            <td>
                                <strong>Record</strong>
                            </td>
                            <td>
                                <strong>Record</strong>
                            </td>
                            <td>
                                <strong>Record</strong>
                            </td>
                            <td>
                                <div class="form-group">
                                    <?php
                                        $query = $con->query("SELECT products_itemDescription FROM pruc_products"); // Run your query --> For Item Desc.
                                        echo '<select class="form-control" id="DescriptionS2forms" name="itemDescription">'; // Open your drop down box

                                        echo '<option value="" selected="selected" disabled></option>'; //Empty Value for VALIDATION
                                        // Loop through the query results, outputing the options one by one
                                        while ($row = $query->fetch(PDO::FETCH_ASSOC)) {
                                           echo '<option value="'.$row['products_itemDescription'].'">'.$row['products_itemDescription'].'</option>';
                                        }
                                        echo '</select>';// Close your drop down box
                                     ?>
                                </div>
                            </td>
                            <td>
                                <strong>Record</strong>
                            </td>
                            <td>
                                <strong>Record</strong>
                            </td>
                            <td>
                                <div>
                                    <input class="form-control" type="number" name="requestQTY" required>
                                </div>
                            </td>
                            <td>
                                <div>
                                    <input class="form-control" type="number" name="requestUnit" step="0.01" min="0.01" max="1000000" required>
                                </div>
                            </td>
                            <td>
                                <strong>Record</strong>
                            </td>
                            <td class="col-md-1" id="deleteBtn">
                                <a class="btn btn-default deleteBtn">Delete</a>
                            </td>
                        </tr>
                    </tbody>
                </table>
            </div>
        </div>
        <!-- End of 3rd Row -->
        <div class="row">
            <a id="add_row" class="btn btn-default pull-right">Add</a>
        </div>

用于添加按钮和select2功能的JS：

$(document).ready(function() {


    var i = 0;
    $("#add_row").click(function() {
        var x = '[{<td><strong>Record</strong></td>      <td><strong>Record</strong></td>      <td><strong>Record</strong></td>      <td><div class="form-group">  <?php $query = $con->query('SELECT products_itemDescription FROM pruc_products'); echo '<select class="form-control" id=DescriptionS2forms'.(i+1).'" name="itemDescription">'; echo '<option value="" selected="selected" disabled></option>'; while($row = $query->fetch(PDO::FETCH_ASSOC)) {echo '<option value="'.$row['products_itemDescription'].'">'.$row['products_itemDescription'].'</option>';} echo '</select>'; ?>  </div></td>      <td><strong>Record</strong></td>      <td><strong>Record</strong></td>      <td><div><input class="form-control" type="number" name="requestQTY" required></div></td>      <td><div><input class="form-control" type="number" name="requestUnit" step="0.01" min="0.01" max="1000000" required></div></td>      <td><strong>Record</strong></td>       <td class="col-md-1" id="deleteBtn"> <a class="btn btn-default deleteBtn">Delete</a></td>}]';

        $('#tab_logic').append('<tr id="addr' + (i + 1) + '">' + x + '</tr>');
        i++;
    });



    $("#SupplierS2forms, #ProjectS2forms, #WHS2forms, #DescriptionS2forms").select2(); });

在PHP选项中，它给出了id =＆＃34; DescriptionS2forms＆＃34; 所以我需要为id添加一个数字，这样我就可以在Select2函数中使用它，因为它不接受相同的id

示例

id="DescriptionS2forms1"和id="DescriptionS2forms2"