使用symfony隐藏树枝中的表格行

时间:2017-08-25 09:52:45

标签: javascript php jquery symfony twig

我正在开始编码。我正在使用Symfony 3.3 我想隐藏(并显示)带有复选框的表格上的一个或一些特定行。 我试过javascript和jquery。我想隐藏的行保持隐藏。 我不知道该怎么做。这是我的树枝

res = df.groupby(['member_id', 'period']).sum()

1 个答案:

答案 0 :(得分:0)

$('.hideshow').on('click',function(){
  let cls = $(this).attr("data-id")
  if ( $('#'+cls).css('display') == 'none' ){
    $('.table tbody').find('#'+cls).show();
  }else{
    $('.table tbody').find('#'+cls).hide();
  }
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>

<div class="container">
  <h3>List of products</h3>

  <div class="buttons">
    <button type="button" data-id="tr1" class="hideshow">Hide/Show Row 1</button>
    <button type="button" data-id="tr2" class="hideshow">Hide/Show Row 2</button>
    <button type="button" data-id="tr3" class="hideshow">Hide/Show Row 3</button>
  </div>
  <table class="table table-striped">
    <thead>
      <tr>
        <th>Product</th>
        <th>Description</th>
        <th>Size</th>
        <th>Charges</th>
        <th>Price</th>
        <th>Actions</th>
        <th>Desactivation</th>
      </tr>
    </thead>

    <tbody>
      <tr id="tr1">
        <td>Product </td>
        <td>Description </td>
        <td>Size </td>
        <td>Charges </td>
        <td>Price</td>
        <td>
          <a href="#">Edit</a>
          <a href="#">Remove</a>
        </td>
        <td><input type="checkbox" name="boutton35" value="Desactivation" />
        </td>
      </tr>
      <tr id="tr2">
        <td>Product </td>
        <td>Description </td>
        <td>Size </td>
        <td>Charges </td>
        <td>Price</td>
        <td>
          <a href="#">Edit</a>
          <a href="#">Remove</a>
        </td>
        <td><input type="checkbox" name="boutton35" value="Desactivation" />
        </td>
      </tr>
      <tr id="tr3">
        <td>Product </td>
        <td>Description </td>
        <td>Size </td>
        <td>Charges </td>
        <td>Price</td>
        <td>
          <a href="#">Edit</a>
          <a href="#">Remove</a>
        </td>
        <td><input type="checkbox" name="boutton35" value="Desactivation" />
        </td>
      </tr>
    </tbody>
  </table>