Скрыть/показать блок в зависимости от radio

[MBmusic]

в общем есть два радио бокса, по умолчанию ничего не выбрано......когда пользователь выбирает первый радио, появляется под ним инфа в таблице, ну типо блок появляеться.......выбирает пользователь второй радио, первый блок первого радио пропадает и вместо него появляеться второй радио...

вот мой код:

<script type="text/javascript">
  function showOrHide(cb, cat) {
    cb = document.getElementById(cb);
    cat = document.getElementById(cat);
    if (cb.checked) cat.style.display = "block";
    else cat.style.display = "none";
  }
</script>

<tr>
<td width="100">Користувач</td>
<td><input type = "radio" id = "cb1" onclick = "showOrHide('cb1', 'cat1');" name="student" value="0"></td>
<td><input type = "radio" id = "cb2" onclick = "showOrHide('cb2', 'cat2');" name="student" value="1"></td>
</tr>


</tr>
<tr id = 'cat1' style = 'display: none;'>
<td>Первый</td>
</tr>
<tr id = 'cat2' style = 'display: none;'>
<td>Второй</td>
</tr>

работает нормально, НО если у нас выбран первый радио, и мы выбираем второй то блок первого радио не пропадает......тоесть у нас при выборе первого радио появляеться блок, когда мы выбираем второй радио у нас под первым появляется второй блок, а должно вместо первого появлятся......в общем вот как это сделать?

[skrudjmakdak]

Дивы relative и absolute

что то подобное я писал. только без радио

[MBmusic]

что то не совсем понятно как у вас там написано) я просто нуб в js хотелось что бы вы конкретно в моей проблеме указали где ошибка и как исправить......спасибо

[skrudjmakdak]

>>>что то не совсем понятно как у вас там написано)
всем хочется всего и сразу.. а вы вот возьмите и разберите))


ну скорей всего событие не onclick, а onchange..

<td><input type = "radio" id = "cb1" onclick = "showOrHide('cat1', 'cat2');" name="student" value="0"></td>
<td><input type = "radio" id = "cb2" onclick = "showOrHide('cat2', 'cat1');" name="student" value="1"></td>

...

<script type="text/javascript">
  function showOrHide(cat1, cat2) {
    cat1 = document.getElementById(cat1);
    cat2 = document.getElementById(cat2);

    cat1.style.display = "block";
    cat2.style.display = "none";
  }
</script>

...
п.с. на работоспособность не проверял, должно быть как то так...

[MBmusic]

поменял onclick на onchange и изменил вышенаписаный js код, не работает......с онкликом тоже не работает(

[skrudjmakdak]

ммм. ну кидайте код, что вы сделали... гляну

[skrudjmakdak]

желательно весь

[MBmusic]

ну сделал то что вы написали выше)

<script type="text/javascript">
  function showOrHide(cat1, cat2) {
    cat1 = document.getElementById(cat1);
    cat2 = document.getElementById(cat2);

    cat1.style.display = "block";
    cat2.style.display = "none";
  }
</script>

<tr>
            <td width="100">Користувач</td>
            <td><input type = "radio" id = "cb1" onchange = "showOrHide('cb1', 'cat1');" name="student" value="0"></td>
			<td><input type = "radio" id = "cb2" onchange = "showOrHide('cb2', 'cat2');" name="student" value="1"></td>
            </tr>
			<tr id = 'cat1' style = 'display: none;'>
				<td>Первый</td>
			</tr>
			<tr id = 'cat2' style = 'display: none;'>
				<td>Второй</td>
			</tr>

[MBmusic]

вот весь код, это у меня шаблон который подключаеться к главному...

<script type="text/javascript">
  function showOrHide(cat1, cat2) {
    cat1 = document.getElementById(cat1);
    cat2 = document.getElementById(cat2);

    cat1.style.display = "block";
    cat2.style.display = "none";
  }
</script>
<div class="shablon_name_title">
<img src="images/icons/adduser.png">
<font>Додати користувача</font>
</div>
<div class="shablon_content">
		 <?=@$this->error?>
		 <form action="" method="post">  
            <table id="tabs">
            <tr>
            <td width="100">Введіть логін</td>
            <td><input name="name_add_user" type="text"></td> 
            </tr>
            <tr>
            <td width="100">Введіть пароль</td>
            <td><input name="pass_add_user" type="password"></td>
            </tr>

			<tr>
            <td width="100">Користувач</td>
            <td><input type = "radio" id = "cb1" onchange = "showOrHide('cb1', 'cat1');" name="student" value="0"></td>
			<td><input type = "radio" id = "cb2" onchange = "showOrHide('cb2', 'cat2');" name="student" value="1"></td>
            </tr>
			<tr id = 'cat1' style = 'display: none;'>
				<td>Первый</td>
			</tr>
			<tr id = 'cat2' style = 'display: none;'>
				<td>Второй</td>
			</tr>
            <tr>
            <td></td>
            <td><input class="button_log_admin" name="submit_add_user" type="submit" value="Додати"></td>  
            </tr>
            </table>
         </form> 
</div>

[skrudjmakdak]

смотрите внимательней что у вас написано, а что я писал!
onchange = "showOrHide('cb1', 'cat1');" - это у вас
onchange можете оставить, клик там даром не нужен