как получить значение элементов строки таблицы при выборе переключателя

У меня есть страница JSP, в которой я динамически создаю таблицу на основе запроса из базы данных. У меня есть переключатель в качестве первого столбца для каждой строки. Я хочу, чтобы при нажатии определенного переключателя все значения элементов в этой строке передавались кнопке.


person gaurav singh    schedule 23.08.2015    source источник


Ответы (1)


Добавьте обработчик click к радиокнопке, возможно, используя делегированный обработчик с корнем в таблице. В обработчике this будет ссылаться на кнопку, поэтому вы можете получить доступ к ее родительской (или предковой) строке. Например.:

$("selector-for-the-table").on("click", "input[type=radio]", function() {
    var row = $(this).closest("tr");
    // ...
});

Если вы хотите получить информацию от других элементов в той же строке, вы можете использовать row.find, чтобы найти их в ряд.

Дополнительные сведения о делегированных обработчиках см. в разделе Прямые и делегированные события в on документации. и различные другие части документации on о том, как определяется this и т. д.

Пример:

$("#the-table").on("click", "input[type=radio]", function() {
  var row = $(this).closest("tr");
  alert(row.find("input").not(this).map(function() {
    return this.value;
  }).get().join(", "));
});
var counter = 0;
addRow();
function addRow() {
  $("#the-table tbody").append(
    "<tr>" +
      "<td><input type=radio></td>" +
      "<td><input type=text value=" + counter + "></td>" +
      "<td><input type=text value=" + (counter * 10) + "></td>" +
    "</tr>"
  );
  if (++counter < 10) {
    setTimeout(addRow, 500);
  }
}
<table id="the-table">
  <tbody>
  </tbody>
</table>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

person T.J. Crowder    schedule 23.08.2015
comment
Я также хочу одну кнопку, при нажатии этой кнопки должно отображаться значение этой строки. - person gaurav singh; 23.08.2015
comment
Да, еще одна вещь, здесь мы можем выбрать несколько переключателей, они не отключаются при нажатии другого переключателя. - person gaurav singh; 23.08.2015
comment
@Т.Дж. Краудер, не могли бы вы рассказать мне, как получить доступ к одному столбцу в строке по имени/идентификатору и присвоить его значение текстовому полю ввода, расположенному ближе к концу формы? - person CodeForGood; 13.08.2020
comment
@CodeForGood - мне нужен пример. Я предлагаю разместить вопрос (после всех обычных вещей - исследований, экспериментов и т. д.) :-) - person T.J. Crowder; 13.08.2020