Question

我有一个用按钮

动态添加行的表

<button class="table-add_line" onclick="addRow()" >+ Add Line</button>

在该表中，我有一个可搜索的选择输入，它只在第一行有效，但在我添加行时没有。第一行是可搜索的，而随按钮添加的其他行只是简单的选择

$('.addRow').on('click', function(){
    addRow();
});

function addRow() {
  var tr = '<tr>' +

    '<td>' +
    '<select class="table-control chosen-select" name="coa_cli_id[]">' +
    '<option value="0" selected="true" disabled="true"></option>' +
    '@if($coas)' +
    '@foreach($coas as $coa)' +
    '<option value="{{$coa->id}}">{{$coa->name}}</option>' +
    '@endforeach' +
    '@endif' +
    '</select>' +
    '</td>' +
    '<td class="table-debit">' +
    '<input type="number" class="table-control" name="debit[]">' +
    '</td>' +
    '<td class="table-credit">' +
    '<input type="number" class="table-control" name="credit[]">' +
    '</td>' +
    '<td class="table-description">' +
    '<input type="text" class="table-control" name="descriptions[]">' +
    '</td>' +
    '<td><span class="table-remove-btn removeRow" onclick="removeRow()">X</span></td>' +
    '</tr>';
  $('tbody').append(tr);
}

以下是一些照片

我希望我添加的所有行都可以搜索我在网上找不到任何东西我尝试多次更改我的搜索代码。谢谢:)）

Answer 1

问题可能来自您的刀片代码。

您应该尝试删除放弃@if的引号。
我希望这会奏效。

function addRow() {
     var tr = '<tr>' +

     '<td>' +
          '<select class="table-control chosen-select" name="coa_cli_id[]">' +
               '<option value="0" selected="true" disabled="true"></option>';
               @if($coas)
                    @foreach($coas as $coa)
                         tr += '<option value="{{$coa->id}}">{{$coa->name}}</option>';
                    @endforeach
               @endif
               tr += '</select>' +
          '</td>' +
          '<td class="table-debit">' +
               '<input type="number" class="table-control" name="debit[]">' +
          '</td>' +
          '<td class="table-credit">' +
               '<input type="number" class="table-control" name="credit[]">' +
          '</td>' +
          '<td class="table-description">' +
               '<input type="text" class="table-control" name="descriptions[]">' +
          '</td>' +
          '<td><span class="table-remove-btn removeRow" onclick="removeRow()">X</span></td>' +
     '</tr>';
     $('tbody').append(tr);
}

Answer 2

已经解决了。我在函数addRow（）的末尾添加了$（＆＃34; .chosen-select＆＃34;）。selected（）

感谢所有回复的人。

将类应用于动态添加的行

2 个答案: