Форум

osetr · #1 (**permalink**) 10.11.2014, 07:50

У меня есть выпадающий список, в котором 57 значений. Надо, чтобы при выборе определенного значения списка, менялось значение двух текстовых полей "hostt" и "lun". Сделал пробный вариант для двух значений списка. Работает. Но для 57 значений так писать не вариант. Сказали, что можно это сделать через хеш-таблицу, но с ней я не разу не работал. Может кто-нибудь помочь ее реализовать??

l_id=getElm("selectScl").value;
  if (l_id==1) {
      hostt.value="'||l_hostt||':'||l_port||'";
      lun.value="'||l_lun||'";
    }
  if (l_id==2) {
      hostt.value="'||l_hostt2||':'||l_port2||'";
      lun.value="'||l_lun2||'";
  }

skrudjmakdak · #2 (**permalink**) 10.11.2014, 08:12

как вариант:

<html>
	<head> 
		<title>Тестирование</title>
	</head>
	<body>
	<select>
		<option value="1">Картошка</option>
		<option value="2">Помидоры</option>
		<option value="3">Курица</option>
		<option value="4">Индюк</option>
	</select>
	<script>
var v = {
	1: {hostt: 'hostt 1', lun: 'lun 1'},
	2: {hostt: 'hostt 2', lun: 'lun 2'},
	3: {hostt: 'hostt 3', lun: 'lun 3'},
	4: {hostt: 'hostt 4', lun: 'lun 4'}
};

document.querySelector('select').onchange = function () {
	console.log(v[this.value]);
}
	</script>
	</body>

</html>

krutoy · #3 (**permalink**) 10.11.2014, 12:19

Гы, тогда уж сразу можно массив использовать.

<html>
    <head>
        <title>Тестирование</title>
    </head>
    <body>
<div></div>
    <select>
        <option value="0">Картошка</option>
        <option value="1">Помидоры</option>
        <option value="2">Курица</option>
        <option value="3">Индюк</option>
    </select>
    <script>
var v = [
    {hostt: 'hostt 0', lun: 'lun 0'},
    {hostt: 'hostt 1', lun: 'lun 1'},
    {hostt: 'hostt 2', lun: 'lun 2'},
    {hostt: 'hostt 3', lun: 'lun 3'}
];


document.querySelector('select').onchange = function () {
   document.getElementsByTagName("div")[0].innerHTML=v[this.value].hostt+", "+v[this.value].lun
}
    </script>
    </body>
 
</html>

skrudjmakdak · #4 (**permalink**) 10.11.2014, 12:21

krutoy,
выбери индюка и увидишь чудо

krutoy · #5 (**permalink**) 10.11.2014, 12:38

skrudjmakdak,
Да, я подправил. Дело не в этом. Нумерация просто, это не принципиально, я думаю.

skrudjmakdak · #6 (**permalink**) 10.11.2014, 12:55

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

Гы, тогда уж сразу можно массив использовать.

можно. но если этот список:
0 - Картошка,
1- Помидоры,
2 - Курица
3 - Индюк
это данные из базы, которые могут удаляться и добавляться:
1- Помидоры
32 - Томат
54 - Оливье
...

тогда ваш алгоритм надо переписывать, а мой нет

krutoy · #7 (**permalink**) 10.11.2014, 13:13

skrudjmakdak,
это то же самое, массив это частный случай объекта

<html>
	 
	<head>
	    <title>Untitled</title>
	</head>
	 
	<body>




<html>
    <head>
        <title>Тестирование</title>
    </head>
    <body>
<div></div>
    <select>
        <option value="0">Картошка</option>
        <option value="1">Помидоры</option>
        <option value="2">Курица</option>
        <option value="3">Индюк</option>
        <option value="10">foo</option>
    </select>
    <script>
var v = [
    {hostt: 'hostt 0', lun: 'lun 0'},
    {hostt: 'hostt 1', lun: 'lun 1'},
    {hostt: 'hostt 2', lun: 'lun 2'},
    {hostt: 'hostt 3', lun: 'lun 3'}
];

v[10]={hostt: 'hostt 10', lun: 'lun 10'}
 
 
document.querySelector('select').onchange = function () {
   document.getElementsByTagName("div")[0].innerHTML=v[this.value].hostt+", "+v[this.value].lun
}
    </script>
    </body>
  
</html>

skrudjmakdak · #8 (**permalink**) 10.11.2014, 13:48

угу, с кучей ненужных элементов внутри:

var v = [
    {hostt: 'hostt 0', lun: 'lun 0'},
    {hostt: 'hostt 1', lun: 'lun 1'},
    {hostt: 'hostt 2', lun: 'lun 2'},
    {hostt: 'hostt 3', lun: 'lun 3'}
];

//v[10]=...
v[1000]={hostt: 'hostt 10', lun: 'lun 10'}
 console.log(v);

<html>
    <head>
        <title>Тестирование</title>
    </head>
    <body>
<div></div>
    <select>
        <option value="13">Картошка</option>
        <option value="24">Помидоры</option>
        <option value="54">Курица</option>
        <option value="76">Индюк</option>
    </select>
    <script>
var data = [
    {id: 13, hostt: 'hostt 0', lun: 'lun 0'},
    {id: 24, hostt: 'hostt 1', lun: 'lun 1'},
    {id: 54, hostt: 'hostt 2', lun: 'lun 2'},
    {id: 76, hostt: 'hostt 3', lun: 'lun 3'}
];

var keys = {
	13: 0,
	24: 1,
	54: 2,
	76: 3
};
 
document.querySelector('select').onchange = function () {
	console.log(data[keys[this.value]]);
}
    </script>
    </body>
  
</html>

krutoy · #9 (**permalink**) 10.11.2014, 13:59

osetr, вообще, мы тут отвлеклись немного. Судя по этому

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

Надо, чтобы при выборе определенного значения списка, менялось значение двух текстовых полей "hostt" и "lun".

Вам может подойти чтото такое:

<html>
	 
	<head>
	    <title>Untitled</title>
	</head>
	 
	<body>




<html>
    <head>
        <title>Тестирование</title>
        <meta charset="windows-1251">
    </head>
    <body>
<div></div>
    <select id="select">
        <option >Картошка</option>
        <option >Помидоры</option>
        <option >Курица</option>
        <option >Индюк</option>
    </select>
<textarea id="hostt"></textarea>
<textarea id="lun"></textarea>
    <script>

get=function(id){
return document.querySelector("#"+id)
}

hostt=get("hostt")
lun=get("lun")
select=get("select")

select.onchange=function(){
hostt.value=lun.value=this.value
}
    </script>
    </body>
  
</html>

В этом ведь основной смысл? И похуй на реализацию.

osetr · #10 (**permalink**) 10.11.2014, 14:00

Спасибо. С реализацией вроде понятно. А не могли бы помочь с выводом этих данных в текстовое поле. например, если выбрал индюк, то в текстовом поле появилась бы запись "индюк - это животное", если выбрал картошка, то в этом же поле появилось бы "картошка - это овощ" и т.д. ну то есть надо написать edit.value="...". Что писать внутри кавычек??

Форум

Справочник

Discord чат

Курсы javascript