Отслеживание изменения элементов

259

20 мая 2017, 20:22

Здравствуйте, как правильно отследить изменение статуса checked input:radio и если отмечен, то брать значение соответствующего ему select (платежный метод), с которым он находится в одной строке таблицы. И наоборот, если произошло изменение select (платёжный метод), то отмечать отмеченным соответствующий input:radio в строке таблицы.

Answer 1

$("input, select").on("change", function() { 
  var $closest = $(this).closest("tr"); 
  var $input = $closest.find("input"); 
  var $select = $closest.find("select"); 
   
  $input.attr("checked", "checked"); 
   
  alert($input.val() + ": " + $select.val()); 
});

table { 
  width: 100%; 
} 
td { 
  padding: 10px; 
  border-bottom: 1px #ccc solid; 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
<table> 
  <tr> 
    <td> 
      <input type="radio" name="pay" value="1"> 
    </td> 
    <td> 
      <select> 
        <option value="1">1</option> 
        <option value="2">2</option> 
        <option value="3">3</option> 
      </select> 
    </td> 
  <tr> 
   
  <tr> 
    <td> 
      <input type="radio" name="pay" value="2"> 
    </td> 
    <td> 
      <select> 
        <option value="4">4</option> 
        <option value="5">5</option> 
        <option value="6">6</option> 
      </select> 
    </td> 
  <tr> 
</table>