2013-10-28 5 views
0

각 행은 표의 확인란과 연결된 일부 행을 제거해야합니다. 나는 이것까지 지금까지 생각해 냈다.jQuery를 사용하여 테이블에서 행 제거

$("#RemoveSelectedTests").click(function() { 
    var testElements = [], len, rowToRemove; 
    testElements = getSelectedTests('what', "selectedTests"); 
    len = testElements.length; 

    for (var i = 0; i < len; i++) { 
     rowToRemove = testElements[i].substring(testElements[i].lastIndexOf("(") + 1, testElements[i].lastIndexOf(")")); 
     $("#" + rowToRemove).remove(); 
    } 
}); 

나에게 위와 같이 보이지만 정확하지 않은 것처럼 보인다. 이 말은 때때로, 행을 올바르게 제거하고, 제거 단추는 행을 제거하기 위해 두 번 이상 눌러야합니다. 그 밖의 어떤 일이 일어나고 있는지 나는 확신 할 수 없다. 나는 무엇을 잘못하고있을 것인가?

getSelectedTests은 처리 할 행을 가져옵니다.

function getSelectedTests(what, id) { 
    var selectedTests = []; 
    $("#" + id + " .rdbtn[type=checkbox]:checked").each(function() { 
     if (!what) { 
      selectedTests.push($(this).val()); 
     } 
     else { 
      selectedTests.push($(this).data('desc') + ' (' + $(this).val() + ')'); 
     } 
    }); 
    return selectedTests; 

답변

1

나는 이것을 조금 더 간단하게 할 수 있다고 생각합니다.

$(function() { 
    $("#removeSelectedTests").click(function() { 
     $(".rdbtn[type=checkbox]:checked").each(function() { 
      $(this).parents("tr").remove(); 
     }); 
    }); 
}); 

<table> 
    <tr> 
    <td><input type="checkbox" class="rdbtn" value=1></td> 
    <td>Test 1</td> 
    </tr> 
    <tr> 
    <td><input type="checkbox" class="rdbtn" value=2></td> 
    <td>Test 2</td> 
    </tr> 
    <tr> 
    <td><input type="checkbox" class="rdbtn" value=3></td> 
    <td>Test 3</td> 
    </tr> 
    <tr> 
    <td><input type="checkbox" class="rdbtn" value=4></td> 
    <td>Test 4</td> 
    </tr> 
    <tr> 
    <td><input type="checkbox" class="rdbtn" value=5></td> 
    <td>Test 5</td> 
    </tr> 
</table> 
<button id="removeSelectedTests">Remove Tests</button> 
관련 문제