如何只启用相关行的按钮？

Question

我有一个 table 正文正在使用 foreach 循环。

 <?php foreach ($list as $test) : ?>

                    <tr>

                        <td>
                            <?= form_open_multipart('/test/update/' . $test['id'], ['class' => 'needs-validation', 'novalidate' => '']); ?>
                            <?= form_dropdown(
                                'something',
                                $option,
                                $test['smt'],
                                ['required' => '', 'id' => 'smt2', 'class' => 'd-block col-12 form-control']
                            ); ?>
                        </td>

                        <td align="right"><button class="btn btn-success btn-sm" type="submit" id="submit" disabled>SAVE UPDATE</a></td>

                        <?= form_close(); ?>
                       </tr>
                <?php endforeach; ?>

对于 javascript 我这样做 :

 $(document).ready(function() {
   

    $('select').on('change', function() {
           $('button').attr('disabled', false);
       });
    });

当用户更改下拉列表的值时，'Save Update' 按钮将被启用。现在，如果用户在任何下拉菜单上进行更改，无论在哪一行，所有按钮都将启用。我希望只启用更改下拉列表的那一行的保存按钮。

Answer 1

您需要使用 DOM 遍历找到与引发 change 事件的 select 相关的 button。您可以使用传递给处理程序函数的事件获取对 button 的引用。从那里你可以使用 closest() 然后 find() 获得最近的公共 tr。试试这个：

jQuery($ => {
  $('select').on('change', e => {
    $(e.target).closest('tr').find('button').prop('disabled', false);
  });
});

请注意使用 prop() 来设置 disabled 标志而不是 attr()。尽可能使用 prop()，因为它避免了对 DOM 的不必要访问，从而提高了性能。

如何只启用相关行的按钮？

How to make only involved row's button enable?

javascript

php

foreach

jquery

codeigniter