jQueryを使用して別のテーブルから行をテーブルにコピーする前にセルを比較する

Question

テーブルから行をコピーする前に、テーブルのすべての行の2番目のセルと2番目のセルを比較しようとしていますjQueryを使用する別のテーブル。しかし、私は条件条項を理解することはできません。これは私が持っているものです。

<table id="schedule" class="table table-stripped table-bordered table-hover"> 
    <thead> 
    <tr> 
     <th></th> 
     <th>time</th> 
     <th>room</th> 
     <th>presenter</th> 
     <th>title</th> 
     <th>detail</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td><input type="checkbox" value="yes"></td> 
     <td>9:00am</td> 
     <td>SE135</td> 
     <td>aaaaa</td> 
     <td>aaaaaa</td> 
     <td>aaaaaaaa</td> 
    </tr> 
    <tr> 
     <td><input type="checkbox" value="yes"></td> 
     <td>9:00am</td> 
     <td>SE145</td> 
     <td>aaaaab</td> 
     <td>aaaaaa</td> 
     <td>aaaaaaaa</td> 
    </tr> 
    </tbody> 
</table> 
<input id="submit" type="button" value="Submit"> 
</article> 
<table id="results"> 
    <thead> 
    <tr> 
     <th></th> 
     <th>time</th> 
     <th>room</th> 
     <th>presenter</th> 
     <th>title</th> 
     <th>detail</th> 
    </tr> 
    </thead> 
    <tbody> 


    </tbody> 
</table> 

すべてのヘルプは高く評価されています

$(function(){ 
    $(document).on("click","#submit",function(){ 
    var getSelectedRows = $("#schedule input:checked").parents("tr").clone(); 
    if ($('#results').find("tr").filter(":contains('$('td:first', $(this).parents('tr')).text()')")) 
     alert("You can't have two events at the same time!"); 
    else 
     $("#results tbody").append(getSelectedRows); 
    }) 
}) 

私はこのHTMLを持っています。前もって感謝します。

Answer 1

まず、選択した行のすべてのインスタンスをループし、各行を結果テーブルの既存のものと比較する必要があります。

反対のプロセスフローでこれを実行します。すでに結果に存在する値の配列を収集します。メインテーブルのチェックされた行をループする際に、その値を配列と比較します。一般的なクラスとdata-属性の追加も、物事

$(function() { 
 
    $(document).on("click", "#submit", function() { 
 
    var $resBody = $('#results tbody'), 
 
     // create array of rooms already in results 
 
     existingRooms = $resBody.find('tr[data-room]').map(function() { 
 
     return $(this).data('room') 
 
     }).get(); 
 
    // log array for demo purposes 
 
    console.log('existingRooms', JSON.stringify(existingRooms)); 
 
    
 
    // now loop through the selected checkboxes 
 
    $("#schedule input:checked").each(function() { 
 
     var $row = $(this).closest('tr'), 
 
     room = $row.data('room'); 
 
     // is current room instance already in array? 
 
     if ($.inArray(room, existingRooms) === -1) { 
 
     $resBody.append($row.clone()); 
 
     } else { 
 
     alert("Room " + room +' already selected'); 
 
     } 
 
    }); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table id="schedule" class="table table-stripped table-bordered table-hover"> 
 
    <thead> 
 
    <tr> 
 
     <th></th> 
 
     <th>time</th> 
 
     <th>room</th> 
 
     <th>presenter</th> 
 
     <th>title</th> 
 
     <th>detail</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr data-room="SE135"> 
 
     <td><input type="checkbox" value="yes"></td> 
 
     <td>9:00am</td> 
 
     <td class="room">SE135</td> 
 
     <td>aaaaa</td> 
 
     <td>aaaaaa</td> 
 
     <td>aaaaaaaa</td> 
 
    </tr> 
 
    <tr data-room="SE145"> 
 
     <td><input type="checkbox" value="yes" checked></td> 
 
     <td>9:00am</td> 
 
     <td class="room">SE145</td> 
 
     <td>aaaaab</td> 
 
     <td>aaaaaa</td> 
 
     <td>aaaaaaaa</td> 
 
    </tr> 
 
    </tbody> 
 
</table> 
 
<input id="submit" type="button" value="Submit"> 
 

 
<table id="results"> 
 
    <thead> 
 
    <tr> 
 
     <th></th> 
 
     <th>time</th> 
 
     <th>room</th> 
 
     <th>presenter</th> 
 
     <th>title</th> 
 
     <th>detail</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 

 

 
    </tbody> 
 
</table>

私はスクリプトの最初と比較しようとしていたことを考え出し