Форум

eFusion · #1 (**permalink**) 02.05.2014, 17:40

Всем привет!
Имеется такой код:

<form>
<table>
<tr>
<td>$row[0]</td>
<td>$row[1]</td>
<td>$row[2]</td>
<td>$row[3]</td>
<td>$row[4]</td>
</tr>
<tr>
<td><p>Текст</p></td>
<td><select class='span1' id='1' name='conn'>
          <option selected='selected'></option>
          <option>Текст</option>
          <option>Текст</option>
          <option>Текст</option>  
        </select></td>
<td><p>Текст</p></td>
        <td><select class='span1' id='2' name='tv'>
           <option selected='selected'></option>
           <option>Текст</option><option>Текст</option>
           <option>Текст</option></td>
<td><p>Текст</p></td>
        <td><select class='span1' id='3' name='inet'>
            <option selected='selected'></option>
            <option>Текст</option>
            <option>Текст</option>
            <option>Текст</option>
           </select>
           </td>
<td><button type='submit' id='continue' name='submit'>Готово</button>
</td>
</tr>
</form>

И таких кусков может быть много.

Пытаюсь реализовать такое:
при клике на строку с select скрывать все остальные строки помимо предыдущей и текущей т.е. строка с переменными php и относящаяся к ней строка с select.

Делаю так:

$(function () {
  $('tr > td').click(function (){
    $(this).parent().nextAll().toggle();
  });
});

Получается, что при нажатии на строку, в которой переменные php, строки тоже скрывается и как это обойти ума не приложу.
Дайте идею.

Спасибо!

рони · #2 (**permalink**) 02.05.2014, 18:03

eFusion,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
  $(function ()
{
  $tr = $('select').parents('tr');
  $tr.click(function (){
    $('tr').not($(this).prev()).not(this).slideUp() ;
  });
  $(':submit').click(function (event){
    event.stopPropagation();
    event.preventDefault();
    $('tr').slideDown()  ;
  })
})  </script>
</head>

<body>
 <form>
<table><tr>
<td>$row[0]test</td>
<td>$row[1]</td>
<td>$row[2]</td>
<td>$row[3]</td>
<td>$row[4]</td>
</tr>
<tr>
<td>$row[0]</td>
<td>$row[1]</td>
<td>$row[2]</td>
<td>$row[3]</td>
<td>$row[4]</td>
</tr>
<tr>
<td><p>Текст</p></td>
<td><select class='span1' id='1' name='conn'>
          <option selected='selected'></option>
          <option>Текст</option>
          <option>Текст</option>
          <option>Текст</option>
        </select></td>
<td><p>Текст</p></td>
        <td><select class='span1' id='2' name='tv'>
           <option selected='selected'></option>
           <option>Текст</option><option>Текст</option>
           <option>Текст</option>
           </select></td>
<td><p>Текст</p></td>
        <td><select class='span1' id='3' name='inet'>
            <option selected='selected'></option>
            <option>Текст</option>
            <option>Текст</option>
            <option>Текст</option>
           </select>
           </td>
<td><button type='submit' id='continue' name='submit'>Готово</button>
</td>
</tr><tr>
<td>$row[0]test</td>
<td>$row[1]</td>
<td>$row[2]</td>
<td>$row[3]</td>
<td>$row[4]</td>
</tr>
</table>
</form>

</body>

</html>

eFusion · #3 (**permalink**) 02.05.2014, 18:31

Спасибо, огромное, но дико извиняюсь, поправка:
необходимо разворачивать строки после нажатия кнопки submit.

рони · #4 (**permalink**) 02.05.2014, 18:48

eFusion,
добавил смотрите код выше

eFusion · #5 (**permalink**) 02.05.2014, 18:58

Отлично!!!
Вы мой Бог!!!
Спасибо!

плюсик не тыкается - сделал бы +1 к карме ))

Форум

Справочник

Discord чат

Курсы javascript