簡體   English   中英

循環表僅在選中復選框的情況下選擇td

[英]Table in loop select only td where checkbox is selected

我試圖做到這一點,以便當用戶選中一個復選框然后點擊一個按鈕(在下面的代碼中未顯示)時,他們將被重定向到其中包含某些詳細信息的新頁面。 我需要為此獲取asset.id值。 我的問題是,我不確定從哪里開始才可以獲取這些值並使用submit按鈕使它們起作用。

HTML

<thead>
  <tr>
    <th>Select</th>
    <th>Model</th>
    <th>Asset Number</th>
    <th>Warranty</th>
    <th>Notes</th>
    <th>Actions</th>
 </tr>
</thead>
<tbody>

   {%  for asset in assets  %}
      <tr>
       <td><input type="checkbox"/></td>
       <td>{{asset.model}}</td>
       {% if loop.first %}<td class="tour-step tour-step-sixteen"><a href="/dashboard/it/asset/{{asset.id}}">{{ prefix }}{{asset.assetNumber}}</a></td>
       {% else %}
       <td><a href="/dashboard/it/asset/{{asset.id}}">{{ prefix }}{{asset.assetNumber}}</a></td>
       {% endif %}
        <td>{{asset.warranty | date("y-m-d")}}</td>
        <td>{{asset.notes}}</td>
        <td>
           <form id="label-form" action="/dashboard/it/label/print" method="POST">
            <button type="submit" class="btn btn-danger"><i class="fa fa-trash-o"></i></button>
           </form>
         </td>
      </tr>
    {% endfor %}

 </tbody>

我還沒有JS,因為我不確定如何開始獲取所需的值以及如何將其保存/傳遞到POST路由。 甚至指導也會很棒。

我已經花了3.5個小時在網上尋找資料,但沒有找到完整的解決方案,它們都缺少某些東西,或者是單個值,不是我需要的多個值。

您可以循環使用表tr並獲取選中了復選框的ID。

提交表單時,您可以調用該函數,然后將該數組發布到服務器上。

這只是一個簡單的示例,現在您可以根據需要使用代碼了

 getSelected = function(){ var array = []; $('#my_table tbody tr').each(function(index, object){ if($(this).find('input[type="checkbox"]').prop("checked")) array.push($(this).find('.id').html()); }); console.log(array); } 
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <table id="my_table"> <thead> <tr> <th>ID</th> <th>Value</th> <th></th> </tr> </thead> <tbody> <tr> <td class="id">1</td> <td>Hola</td> <td><input type="checkbox"></td> </tr> <tr> <td class="id">2</td> <td>Como</td> <td><input type="checkbox"></td> </tr> <tr> <td class="id">3</td> <td>Stas</td> <td><input type="checkbox"></td> </tr> </tbody> </table> <button onclick="getSelected()"> Get Selected </button> 

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM