Гость
Войти | Профиль | Очистить
Целевая тема:
Создать новую тему:
Автор:
Действия ...
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Поле ввода с выпадающим списком. / 5 сообщений из 5, страница 1 из 1
21.12.2012, 14:33
    #38088195
nickstarnew
nickstarnew
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Поле ввода с выпадающим списком.
Доброго времени суток!

Можно ли стандартными средствами html и javascript (без фрэйм ворков) сделать поле ввода с выпадающим списком.
Т.е. код
Код: html
1.
2.
3.
4.
<SELECT>
<OPTION>Справка из мест лишения свободы</OPTION>
<OPTION>Военный билет</OPTION>
</SELECT>


создает список, в котором можно выбрать только из него, и нельзя ввести значение если оно в списке отсутствует.
Можно ли реализовать стандартными способами. Список с возможностью ввода отсутствующего значения?
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
21.12.2012, 14:44
    #38088211
Паганель
Паганель
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Поле ввода с выпадающим списком.
я бы сделал по-другому
в список довавляется пункт "другое"
при выборе этого пункта становится видимым поле ввода текста, куда это "другое" и вводят

ну... так как-то более принято что ли
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
21.12.2012, 14:44
    #38088214
Сергей111
Сергей111
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Поле ввода с выпадающим списком.
Вот пример поля Select и функции, добавляющей в список опций введенную новую.
Код: html
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
	<select class="element select medium" id="element1" name="element1"> 
	   <option value="" selected="selected"></option>
	   <option value="1" >Project1</option>
	   <option value="2" >Project2</option>
	</select>
	<input type="button" value="Add" onclick="function1(document.all.element1);">

		function function1(x) { 
			var newOption = document.createElement('option');
			x.options.add(newOption);//alert(document.all.element1.options[2].text);
			newOption.innerText = document.getElementById("newopt").value;
			document.getElementById("newopt").value="";
		}
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
22.12.2012, 18:28
    #38089217
Програмёр
Програмёр
Участник
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Поле ввода с выпадающим списком.
nickstarnewДоброго времени суток!

Можно ли стандартными средствами html и javascript (без фрэйм ворков) сделать поле ввода с выпадающим списком.
Т.е. код
Код: html
1.
2.
3.
4.
<SELECT>
<OPTION>Справка из мест лишения свободы</OPTION>
<OPTION>Военный билет</OPTION>
</SELECT>


создает список, в котором можно выбрать только из него, и нельзя ввести значение если оно в списке отсутствует.
Можно ли реализовать стандартными способами. Список с возможностью ввода отсутствующего значения?
А в чём проблема? при фокусе на поле ввода (или при вводе символа... по желанию) создаём div под инпутом, где перебираем список предложенных позиций (заданных ранее) и ищем соответствие с введёнными критериями. При клике на одну из позиций пишем её как значение инпута.
P.S. в программировании можно всё.
P.P.S. Если всё же не совсем против фрэйм ворков, то можно глянуть в сторону autocomplete и jquery. решается всё в несколько строк
...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
27.02.2013, 21:09
    #38168695
tages
tages
Гость
Скрыть профиль Поместить в игнор-лист Сообщения автора в теме
Поле ввода с выпадающим списком.
Вот как я это сделал в свое время. Даже если не актуально, то потомкам будет легче:)
 
Посмотреть пример
Код: sql
1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
<style>
#dropdown{
list-style: none;
position:absolute; 
background:#ffffaa; 
cursor: default; 
margin: -20px 0px 0px 229px; 
padding: 2px 0px 2px 0px;
width:155px
}
#dropdown li{
padding: 3px 3px 3px 3px;
}
#dropdown li:hover{
color:#fff;
padding: 3px 3px 3px 3px;
background:#0000FF; 
}
</style>
<script type="text/javascript">
function down()
{
  var a = document.getElementById('dropdown');
  if ( a.style.display == 'none' )
    a.style.display = 'block'
  else
    if ( a.style.display == 'block' )
    a.style.display = 'none';
};
function select_date(val_date){
	var b = document.getElementById('date_input');
	b.value=val_date;
	down();
}
</script>
</head>
<body>
		<h3>выберите/введите время &ndash;<input id="date_input" type="text" size="20" maxlength="50" name ="delivery_period_time" onclick="down()" ></h3>	
		<ul id="dropdown" style="display:none;">
		   <li class="facebook" onclick="select_date('с 11:00 до 14:00')">с 11:00 до 14:00</li>
		   <li class="twitter" onclick="select_date('с 14:00 до 18:00')">с 14:00 до 18:00</li>
		   <li class="gplus" onclick="select_date('с 18:00 до 21:00')">с 18:00 до 21:00</li>
		</ul>
</body>

...
Рейтинг: 0 / 0
| Ответить | Цитировать | Написать  
Форумы / HTML, JavaScript, VBScript, CSS [игнор отключен] [закрыт для гостей] / Поле ввода с выпадающим списком. / 5 сообщений из 5, страница 1 из 1
Найденые пользователи ...
Разблокировать пользователей ...
Читали тему (0):
Читали форум (0):
Пользователи онлайн (0):
Польз. соглашение  
Полит. конфиден.  
созд. / загр.: 313ms
Закрыть
start [/forum/topic.php?fid=22&mobile=1&tid=1448650]:
 0ms
get settings:
 5ms
get forum list:
 11ms
check forum access:
 5ms
check topic access:
 5ms
track hit:
 32ms
get topic data:
 6ms
get forum data:
 1ms
get page messages:
 28ms
get tp. blocked users:
 1ms
others: 219ms
total:  313ms
x
x
Закрыть


Просмотр
0 / 0
Close
Debug Console [Select Text]