Форум

Smip · #1 (**permalink**) 23.01.2013, 05:51

Здравствуйте, помогите кто знает.
Есть таблица, в каждой строке есть столбик в котором есть checkbox, нужно сделать кнопку по нажатию которой строки где чекбокс не выбран, скрывались. В интернете нашёл что-то подобное, но ума довести до конца не хватило. Вот что нашёл:

$("checkbox").click(function () {
    if (this.checked)
        //чекбокс выбран
    else
        //чекбокс выключен
});

Я так понимаю, здесь немного не то что мне надо.

ОлегА · #2 (**permalink**) 23.01.2013, 08:01

<button>Кнопка</button>
<table id="my_table">
<tbody>
<tr>
<td>text1</td><td><input type="checkbox"></td>
</tr>
<tr>
<td>text2</td><td><input type="checkbox"></td>
</tr>
<tr>
<td>text3</td><td><input type="checkbox"></td>
</tr>
<tr>
<td>text4</td><td><input type="checkbox"></td>
</tr>
<tr>
<td>text5</td><td><input type="checkbox"></td>
</tr>
</tbody>
</table>

$(function(){
    $("button").click(function () {
        $('#my_table').find('input[type=checkbox]').each(function(){
            if (! $(this).is(':checked'))
                $(this).closest('tr').hide();
        })
    });
});

rgl · #3 (**permalink**) 23.01.2013, 13:34

Не как образец правильного стиля, а как демонстрашка, покритикуйте:

<!doctype html>
<html>
<head>
<title>Hide unchecked rows</title>

<script type="text/javascript">

function show() {
  var t = document.getElementById( "t" );
  for( var i = 0; i < t.rows.length; ++i )
    t.rows[i].style.visibility = "visible";
}

function hide() {
  var t = document.getElementById( "t" );
  for( var i = 0; i < t.rows.length; ++i )
    if( ! t.rows[i].cells[1].firstChild.checked )
      t.rows[i].style.visibility = "collapse";
}

</script>

</head>

<body>

<table id="t">
  <tr><td>1</td><td><input type="checkbox"></td><td>asdfasdf</td></tr>
  <tr><td>2</td><td><input type="checkbox"></td><td>wsfdvwdf</td></tr>
  <tr><td>3</td><td><input type="checkbox"></td><td>ojsdhsff</td></tr>
  <tr><td>4</td><td><input type="checkbox"></td><td>qadifoqf</td></tr>
  <tr><td>5</td><td><input type="checkbox"></td><td>poqwiefh</td></tr>
</table>

<input type="button" value="Show" onclick="show()">
<input type="button" value="Hide" onclick="hide()">

</body>
</html>

Smip · #4 (**permalink**) 23.01.2013, 14:48

Спасибо всем! помогли! +1 вам

Форум

Справочник

Discord чат

Курсы javascript