Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 08.05.2013, 16:36
Аспирант
Отправить личное сообщение для MBmusic Посмотреть профиль Найти все сообщения от MBmusic
 
Регистрация: 08.05.2013
Сообщений: 43

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

вот мой код:
<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>


работает нормально, НО если у нас выбран первый радио, и мы выбираем второй то блок первого радио не пропадает......тоесть у нас при выборе первого радио появляеться блок, когда мы выбираем второй радио у нас под первым появляется второй блок, а должно вместо первого появлятся......в общем вот как это сделать?
Ответить с цитированием
  #2 (permalink)  
Старый 08.05.2013, 16:39
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

Дивы relative и absolute

что то подобное я писал. только без радио
Ответить с цитированием
  #3 (permalink)  
Старый 08.05.2013, 16:48
Аспирант
Отправить личное сообщение для MBmusic Посмотреть профиль Найти все сообщения от MBmusic
 
Регистрация: 08.05.2013
Сообщений: 43

что то не совсем понятно как у вас там написано) я просто нуб в js хотелось что бы вы конкретно в моей проблеме указали где ошибка и как исправить......спасибо
Ответить с цитированием
  #4 (permalink)  
Старый 08.05.2013, 16:58
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

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


ну скорей всего событие не 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>

...
п.с. на работоспособность не проверял, должно быть как то так...
Ответить с цитированием
  #5 (permalink)  
Старый 08.05.2013, 17:03
Аспирант
Отправить личное сообщение для MBmusic Посмотреть профиль Найти все сообщения от MBmusic
 
Регистрация: 08.05.2013
Сообщений: 43

поменял onclick на onchange и изменил вышенаписаный js код, не работает......с онкликом тоже не работает(
Ответить с цитированием
  #6 (permalink)  
Старый 08.05.2013, 17:05
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

ммм. ну кидайте код, что вы сделали... гляну
Ответить с цитированием
  #7 (permalink)  
Старый 08.05.2013, 17:05
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

желательно весь
Ответить с цитированием
  #8 (permalink)  
Старый 08.05.2013, 17:08
Аспирант
Отправить личное сообщение для MBmusic Посмотреть профиль Найти все сообщения от MBmusic
 
Регистрация: 08.05.2013
Сообщений: 43

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

<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>
Ответить с цитированием
  #9 (permalink)  
Старый 08.05.2013, 17:10
Аспирант
Отправить личное сообщение для MBmusic Посмотреть профиль Найти все сообщения от MBmusic
 
Регистрация: 08.05.2013
Сообщений: 43

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

<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>
Ответить с цитированием
  #10 (permalink)  
Старый 08.05.2013, 17:17
Профессор
Отправить личное сообщение для skrudjmakdak Посмотреть профиль Найти все сообщения от skrudjmakdak
 
Регистрация: 27.04.2012
Сообщений: 1,410

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

Последний раз редактировалось skrudjmakdak, 08.05.2013 в 17:22.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Скрыть/показать элементы в зависимости от значения select AnyKeyLeft Элементы интерфейса 12 16.07.2014 16:26
html код в зависимости от выбора radio Findail Общие вопросы Javascript 6 30.03.2013 12:53
<select> в зависимости от выбранного radio imediasun1 Элементы интерфейса 1 23.12.2012 23:38
Появление блоков div в зависимости от radio Oracool Events/DOM/Window 1 04.12.2009 18:39
выполнение ф-ии при изменении состояния radio MaxB Events/DOM/Window 5 24.06.2009 14:24