Вопросы Теги

Как получить данные таблицы строк в другой таблице, когда я устанавливаю флажок в этой строке?

Техника, которую мы используем на работе, - это запросить файл javascript, используя запрос AJAX, а затем eval () return. Если вы используете библиотеку прототипов, они поддерживают эту функцию в своем вызове Ajax.Request.

-1
задан Arulraj 13 July 2018 в 12:21
поделиться

2 ответа

Проверьте этот фрагмент. Надеюсь, что это поможет! 

$(document).ready(function() {
  $(document).on("change", ".tot_amount", function() {
    var $tr = $(this).closest("tr");
    var $trClass = $(this).closest("tr").attr("class");
    if (this.checked) {
      $("#table2 tbody").append("<tr class='"+ $trClass +"'>" + $tr.html() + "</tr>");
      $("#table2 tbody").find('input').parent().remove();
    } else {
    	
      $('#table2').find(".servicetr").each(function() {
        if($tr.hasClass("subscription")){
        	$("#table2").find(".subscription").remove();
        } else if($tr.hasClass("registration")){
        	$("#table2").find(".registration").remove();
        }
      });
    }
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table cellspacing="0" rules="all" border="1" id="table1" style="border-collapse:collapse;">
  <tbody>

    <tr>
      <th scope="col">Service </th>
      <th scope="col">Amount</th>
      <th scope="col">tax</th>
      <th scope="col">Action</th>
    </tr>

    <tr class='servicetr subscription'>
      <td class="service">
        <span>Subscription Charges</span>
      </td>
      <td>
        <span>500.00</span>
      </td>
      <td class="service">
        <span>90.00</span>
      </td>
      <td>
        <input type="checkbox" data-toggle="checkbox" class="tot_amount" value="590.00" />
      </td>
    </tr>

    <tr class='servicetr registration'>
      <td>
        <span>registration fees</span>
      </td>
      <td>
        <span>200.00</span>
      </td>
      <td>
        <span>80.00</span>
      </td>
      <td>
        <input type="checkbox" data-toggle="checkbox" class="tot_amount" value="590.00" />
      </td>
    </tr>
  </tbody>
</table>

<br/>

<table cellspacing="0" rules="all" border="1" id="table2" style="border-collapse:collapse;">
  <tbody>

    <tr>
      <th scope="col">Service </th>
      <th scope="col">Amount</th>
      <th scope="col">tax</th>
    </tr>

  </tbody>
</table>

1
ответ дан David 17 August 2018 в 13:06
поделиться

Вот еще один способ сделать это; используя data-id для идентификации строки, которую нужно удалить. 

$(document).ready(function(){
  $(document).on("change",".tot_amount",function(){  
    if (this.checked){  
      var $tr = $(this).closest("tr").clone();
      $tr.find("td").last().remove();
      $("#table2 tbody").append($tr);
    } else {
      var $trid = $(this).closest("tr").data('id');  
      $('#table2').find(".servicetr[data-id='" + $trid + "']").remove();
    }
  });
});
  <!DOCTYPE html>
<html>
<head>
  <title>table</title>
</head>
<body>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<table cellspacing="0" rules="all" border="1" id="table1" style="border-collapse:collapse;">
    <tbody>
        <tr>
          <th scope="col">Service </th>
          <th scope="col">Amount</th>
          <th scope="col">tax</th>
          <th scope="col">Action</th>
        </tr>

        <tr class='servicetr' data-id="1">
          <td class="service">
            <span>Subscription Charges</span>
          </td>
          <td>
            <span>500.00</span>
          </td>
          <td class="service">
            <span >90.00</span>
          </td>
          <td >
            <input type="checkbox" data-toggle="checkbox" class="tot_amount" value="590.00"  /> 
          </td>
      </tr>

      <tr class='servicetr' data-id="2">
        <td>
          <span>registration fees</span>
        </td>
        <td>
          <span>200.00</span>
        </td>
        <td>
          <span >80.00</span>
        </td>
        <td>
          <input type="checkbox" data-toggle="checkbox" class="tot_amount" value="590.00"  /> 
        </td>
      </tr>
    </tbody>
</table>

<br/>

<table cellspacing="0" rules="all" border="1" id="table2" style="border-collapse:collapse;">
    <tbody>
        <tr>
          <th scope="col">Service </th>
          <th scope="col">Amount</th>
          <th scope="col">tax</th>
        </tr>
    </tbody>
</table>
<br/>

</body>
</html>

0
ответ дан TiiJ7 17 August 2018 в 13:06
поделиться
Другие вопросы по тегам:

Похожие вопросы: