Laravel: сгенерированные кнопки с l oop (как определить, какая кнопка нажата)

Question

Hello Again Stockoverflow, надеюсь, у вас все хорошо,

Можете ли вы помочь мне снова с Laravel / Ajax?

Из приведенного ниже кода я создал таблицу, показанную на что я хочу сделать, чтобы sh сохранить каждую строку, когда кнопка нажата, я достаточно знаю ajax, чтобы сохранить, проблема в том, как я могу сказать ajax и jquery, какая кнопка строки щелкните, и какой текстовый ввод имеет значение с тех пор, текстовые вводы и кнопки генерируются с помощью цикла / массива?

Спасибо.

            if($list_factors)
        {
            foreach ($list_factors as $key => $list_factor) {
               // dd($list_factors);
                $output.='<tr>'.
                '<td>'.$list_factor->id.'</td>'.
                '<td>'.$list_factor->factor_description.'</td>'.
                '<td><input type="text" id="score" /></td>'.
                '<td><button class="btn btn-info" id="submitScore">OK</button></td>'.
                '</tr>';

            }
            return Response($output);
        }

Answer 1

Прежде всего, вы не можете использовать атрибут id="submitScore" в кнопке, сгенерированной в l oop, потому что id должен быть уникальным. Вместо этого вы можете использовать class="submitScore". Кроме того, вы не можете использовать id="score" в input, используйте class="score" Так как вы собираетесь использовать jQuery, тогда вы можете попробовать что-то вроде этого:

// Register the event handler on 'submitScore' class of button
$('button.submitScore').on("click", function(e) {
    var row = $(this).closest('tr');
    var inputValue = row.find('.score').val();
    console.log(inputValue);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

<table>
    <tr>
        <td><input class='score' /></td>
        <td><button class='submitScore'>OK</button></td>
    </tr>
    <tr>
        <td><input class='score' /></td>
        <td><button class='submitScore'>OK</button></td>
    </tr>
 </table>