Javascript-форум - Появление формы при выборе пункта выпадающего списка

Javascript-форум (https://javascript.ru/forum/)

- Элементы интерфейса (https://javascript.ru/forum/dom-window/)

- - Появление формы при выборе пункта выпадающего списка (https://javascript.ru/forum/dom-window/63908-poyavlenie-formy-pri-vybore-punkta-vypadayushhego-spiska.html)

Цитата:

Сообщение от MadMaxZZZ

вообще о разных вещах говорим...

Начни с документации и сразу поймешь, что ты ничего сам не понял в том, что захотел делать. Это же наше все - начинать рисовать теги не пытаясь написать по-русски самому себе хотя бы ТЗ. Ну, то есть русского не знаем, зато жабускрипту знаем. Лол.

Цитата:

Сообщение от warren buffet (Сообщение 421616)

Я четко понимаю что хочу видеть, это я описал выше (при выборе пункта из второго выпадающего списка нужно показать форму). Что тут непонятного? Нужно 100500 строк кода для этого написать? Нужно столько же умных книг прочесть?

Цитата:

при выборе пункта из второго

Это как дети подписывают тетрадки "Моя". Лолшто?

Короче, модели рисовать не хочешь - плати деньги.

Чтобы показать "форму" из "второго" списка, надо написать специальную функцию для второго списка, которая будет знать, какую форму надо показать. Сколько списков - столько функций. Нетрудно заметить, что они будут похожие, следовательно можно сделать одну, а ключевые отличия внести как данные в хтмл. В хтмл щас пишут вообще все подряд, так что если не хочешь рисовать модели - рисуй атрибуты. Например в списке "второй" должен быть атрибут data-form (как и во всех остальных списках) который прочитает скрипт select.getAttribute('data-form') и откроет эту форму по

document.getElementById(select.getAttribute('data-form')).style.display='';

В форме должен быть такой же id='form-buh' как в списке data-form='form=buh'

По циферкам адресоваться не надо, они постоянно норовят сместиться или разбежаться.

warren buffet,
вы вижу ну прямо дока в MVC, но передо мной чего то "пальцы пялить", не я автор темы, а автору еще нужно научится разбираться с if...else, прежде чем сталкиваться с понятием контроллер.

О кактусах к своей попе, это в соцсетях. ;)

Всем спасибо за помощь, но услышал внятный ответ не на профильном форуме...пикабушники добрее оказались и все внятно объяснили..

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
	<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>Select со скрытыми блоками div</title>
</head>

<body>

<script>
function Selected(a) {		
       
            document.getElementById("Block1").style.display='none';
            document.getElementById("Block2").style.display='none';
            document.getElementById("Block3").style.display='none';
            document.getElementById("Block4").style.display='none';
            document.getElementById("Block5").style.display='none';
       
       document.getElementById("Block"+a).style.display='block';
    }
    function Formshow(a) {		
       
            document.getElementById("form1").style.display='none';
            document.getElementById("form2").style.display='none';
            document.getElementById("form3").style.display='none';           
       
       document.getElementById("form"+a).style.display='block';
    }
</script>
<div>Выберите тип документа из выпадающего списка:</div><br>
<select id="actSelect" onChange="Selected(this.value)">
       <option value="" selected="selected">-</option>
       <option value="1">Бухгалтерский документ</option>
       <option value="2">Договор</option>
       <option value="3">Дополнительное соглашение</option>
       <option value="4">Письмо</option>
       <option value="5">Приказ</option>
       <option value="6">Распоряжение</option>
</select>
     
   
    <div id='Block1' style='display: none;'><br>
      Выберите документ:
            <select onChange="Formshow(this.value)">
                   <option value="" selected="selected">-</option>
                   <option value="1">Акт</option>
                   <option value="2">Накладная</option>
                   <option value="3">Счет-фактура</option>
            </select>
            
				<div id="form1" style='display: none;'>
							
						<form method="post" action="index.php">
						 
						 
								Полное название организации <br/>
								<textarea cols="40" rows="2" name="fullname"></textarea><br/>
								Короткое название организации <br/>
								<input type="text" name="smallname" /><br/>
								ИНН организации <br/>
								<input type="text" name="inn" /><br/>
								КПП организации <br/>
								<input type="text" name="kpp" /><br/>
								Индекс организации <br/>
								<input type="text" name="ind" /><br/>
								Страна расположения организации <br/>
								<input type="text" name="strana" /><br/>
								Город организации <br/>
								<input type="text" name="gorod" /><br/>
								Адрес организации <br/>
								<input type="text" name="adress" /><br/><br/>
								<input type="submit" name="add" value="Добавить организацию" />
						</form>
			
			</div>
            <div id="form2" style='display: none;'>
			
			<form method="post" action="index.php">
						 
						 
								Форма <br/>
								<textarea cols="40" rows="2" name="fullname"></textarea><br/>
								Форма <br/>
								<input type="text" name="smallname" /><br/>
								Форма <br/>
								<input type="text" name="inn" /><br/>
								Форма <br/>
								<input type="text" name="kpp" /><br/>
								Форма <br/>
								<input type="text" name="ind" /><br/>
								Форма <br/>
								<input type="text" name="strana" /><br/>
								Форма <br/>
								<input type="text" name="gorod" /><br/>
								Форма <br/>
								<input type="text" name="adress" /><br/><br/>
								<input type="submit" name="add" value="Добавить организацию" />
						</form>
			
			</div>
            <div id="form3" style='display: none;'>форма три</div>
    </div>
   
    <div id='Block2' style='display: none;'><br>
        Предмет договора:
            <select>
                   <option value="" selected="selected">-</option>
                   <option value="rabota">Выполнение работ</option>
                   <option value="uslugi">Оказание услуг</option>
                   <option value="postavka">Поставка</option>
            </select>
    </div>
   
    <div id='Block3' style='display: none;'><br>
      Предмет соглашения:
            <select>
                    <option value="" selected="selected">-</option>
                    <option value="cena">Изменение цены</option>
                    <option value="srok">Изменение сроков</option>
                    <option value="obem">Изменение объемов</option>
            </select>
    </div>
   
    <div id='Block4' style='display: none;'><br>
      Выберите тип письма:
            <select>
                    <option value="" selected="selected">-</option>
                    <option value="vhod">Входящее</option>
                    <option value="ishod">Исходящее</option>
            </select>
    </div>
 
<div id='Block5' style='display: none;'><br>  
<form method="post" action="index.php">
 
 
        Полное название организации <br/>
        <textarea cols="40" rows="2" name="fullname"></textarea><br/>
        Короткое название организации <br/>
        <input type="text" name="smallname" /><br/>
        ИНН организации <br/>
        <input type="text" name="inn" /><br/>
        КПП организации <br/>
        <input type="text" name="kpp" /><br/>
        Индекс организации <br/>
        <input type="text" name="ind" /><br/>
        Страна расположения организации <br/>
        <input type="text" name="strana" /><br/>
        Город организации <br/>
        <input type="text" name="gorod" /><br/>
        Адрес организации <br/>
        <input type="text" name="adress" /><br/><br/>
        <input type="submit" name="add" value="Добавить организацию" />
</form>    

</div> 

</body>
</html>

Только когда попробовал помочь халявщику, дошла полная картина репина приплыли. Ну, то есть, корвет - это судно из коры и веток, или из коры и ветоши по мнению ТСа )))

<!DOCTYPE html>
<html lang="ru" dir="ltr">
<head>
<meta charset="utf-8">
</head>

<body>

<script>
(function(){

	var mister_hide=function(e){
	
		var n = this.value,
			key= this.getAttribute('data-key');
			
		for(var div, i=0; div = document.getElementById(key+i); i++)
			div.style.display='none'
		
		if(!(div = document.getElementById(key+n)))
			alert('НАКОСЯЧИЛ! '+ key+n);
		else
			div.style.display='';
	};
	
	var init=function(){
		document.getElementById('actSelect').addEventListener('change',mister_hide);
		document.getElementById('docSelect').addEventListener('change',mister_hide);
	};
	
	window.addEventListener('load',init);
	
})();
</script>

<div>Выберите тип документа из выпадающего списка:</div><br>

<select id="actSelect" data-key="Block">
   <option value="" selected="selected">-</option>
   <option value="1">Бухгалтерский документ</option>
   <option value="2">Договор</option>
   <option value="3">Дополнительное соглашение</option>
   <option value="4">Письмо</option>
   <option value="5">Приказ</option>
   <option value="6">Распоряжение</option>
</select>
   
<div id='Block1' style='display: none;'><br>
Выберите документ:
<select id="docSelect" data-key="form">
	   <option value="" selected="selected">-</option>
	   <option value="1">Акт</option>
	   <option value="2">Накладная</option>
	   <option value="3">Счет-фактура</option>
</select>

<div id="form1" style='display: none;'>
<form method="post" action="index.php">
	Полное название организации <br/>
	<textarea cols="40" rows="2" name="fullname"></textarea><br/>
	Короткое название организации <br/>
	<input type="text" name="smallname" /><br/>
	ИНН организации <br/>
	<input type="text" name="inn" /><br/>
	КПП организации <br/>
	<input type="text" name="kpp" /><br/>
	Индекс организации <br/>
	<input type="text" name="ind" /><br/>
	Страна расположения организации <br/>
	<input type="text" name="strana" /><br/>
	Город организации <br/>
	<input type="text" name="gorod" /><br/>
	Адрес организации <br/>
	<input type="text" name="adress" /><br/><br/>
	<input type="submit" name="add" value="Добавить организацию" />
</form>
</div>

<div id="form2" style='display: none;'>
<form method="post" action="index.php">
		Форма <br/>
		<textarea cols="40" rows="2" name="fullname"></textarea><br/>
		Форма <br/>
		<input type="text" name="smallname" /><br/>
		Форма <br/>
		<input type="text" name="inn" /><br/>
		Форма <br/>
		<input type="text" name="kpp" /><br/>
		Форма <br/>
		<input type="text" name="ind" /><br/>
		Форма <br/>
		<input type="text" name="strana" /><br/>
		Форма <br/>
		<input type="text" name="gorod" /><br/>
		Форма <br/>
		<input type="text" name="adress" /><br/><br/>
		<input type="submit" name="add" value="Добавить организацию" />
</form>
</div>

<div id="form3" style='display: none;'>форма три</div>

</div>
<div id='Block2' style='display: none;'><br>
Предмет договора:
	<select>
	   <option value="" selected="selected">-</option>
	   <option value="rabota">Выполнение работ</option>
	   <option value="uslugi">Оказание услуг</option>
	   <option value="postavka">Поставка</option>
	</select>
</div>

<div id='Block3' style='display: none;'><br>
  Предмет соглашения:
	<select>
		<option value="" selected="selected">-</option>
		<option value="cena">Изменение цены</option>
		<option value="srok">Изменение сроков</option>
		<option value="obem">Изменение объемов</option>
	</select>
</div>

<div id='Block4' style='display: none;'><br>
  Выберите тип письма:
	<select>
		<option value="" selected="selected">-</option>
		<option value="vhod">Входящее</option>
		<option value="ishod">Исходящее</option>
	</select>
</div>

<div id='Block5' style='display: none;'>
<br/>  
	<form method="post" action="index.php">
		Полное название организации
		<br/><textarea cols="40" rows="2" name="fullname"></textarea>
		<br/>Короткое название организации
		<br/><input type="text" name="smallname" />
		<br/>ИНН организации
		<br/><input type="text" name="inn" /><br/>
		КПП организации <br/>
		<input type="text" name="kpp" /><br/>
		Индекс организации <br/>
		<input type="text" name="ind" /><br/>
		Страна расположения организации <br/>
		<input type="text" name="strana" /><br/>
		Город организации <br/>
		<input type="text" name="gorod" /><br/>
		Адрес организации <br/>
		<input type="text" name="adress" /><br/><br/>
		<input type="submit" name="add" value="Добавить организацию" />
	</form>    
</div> 
</body>
</html>

Ну то есть у него косячный хтмл, в котором без полкило водки за ночь не разберешься, а он на форуме жаба-кодеров задает вопросы, как заставить эту тряхомудию работать. Лолблин.