Форум программистов, компьютерный форум, киберфорум
Наши страницы
JavaScript
Войти
Регистрация
Восстановить пароль
 
Рейтинг 5.00/5: Рейтинг темы: голосов - 5, средняя оценка - 5.00
kos0760
1 / 1 / 0
Регистрация: 01.11.2013
Сообщений: 22
#1

Зависимость значения одного поля от суммы двух других полей

20.05.2015, 00:56. Просмотров 865. Ответов 6
Метки нет (Все метки)

Здравствуйте! Вопрос. Имеется форма с полями выпадающих списков. Вот код:

Javascript
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
45
46
47
48
49
50
51
52
53
54
<span class="krit">Внутренние камеры:</span>
<p style="display: none;" rel="Внутренние камеры"></p>
 <select name="op1" id="">
    <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t0">0</option>
    <option value="t1">1</option>
    <option value="t2">2</option>
    <option value="t3">3</option>
    <option value="t4">4</option>
    <option value="t4">5</option>
    <option value="t4">6</option>
    <option value="t4">7</option>
    <option value="t4">8</option>
    <option value="t4">9</option>
    <option value="t4">10</option>
    <option value="t4">11</option>
    <option value="t4">12</option>
    <option value="t4">13</option>
    <option value="t4">14</option>
    <option value="t4">15</option>
   </select>    
     
    
    <span class="krit">Уличные камеры:</span>
    <p style="display: none;" rel="Уличные камеры"></p>
 <select name="op4" id="">
 <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t0">0</option>
    <option value="t1">1</option>
    <option value="t2">2</option>
    <option value="t3">3</option>
    <option value="t4">4</option>
    <option value="t4">5</option>
    <option value="t4">6</option>
    <option value="t4">7</option>
    <option value="t4">8</option>
    <option value="t4">9</option>
    <option value="t4">10</option>
    <option value="t4">11</option>
    <option value="t4">12</option>
    <option value="t4">13</option>
    <option value="t4">14</option>
    <option value="t4">15</option>
   </select>
 
   <span class="krit">Видеорегистратор(кан.):</span>
   <p style="display: none;" rel="Видеорегистратор(кан.)"></p>
 <select name="op3">
 <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t1">4</option>
    <option value="t2">8</option>
    <option value="t3">16</option>
    <option value="t4">32</option>  
   </select>
Как сделать, чтобы при выборе допустим 4 камер внутренних и 4 уличных в поле ВИДЕОРЕГИСТРАТОР скрывалась цифра 4 и подставлялась цифра 8, т.е. необходимо суммировать количество камер и округлять до ближайшего большего (если сумма камер 9, то минимальное значение в поле видеорегистратор должно быть 16).

Спасибо!
0
Лучшие ответы (1)
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
Similar
Эксперт
41792 / 34177 / 6122
Регистрация: 12.04.2006
Сообщений: 57,940
20.05.2015, 00:56
Ответы с готовыми решениями:

Расчитать значение поля исходя из двух других
Где ошибка? &lt;div class=&quot;ccms_form_element cfdiv_radio&quot;...

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

Зависимость значений одного <select> от другого
Прошу помощи у знатоков.. Есть 2 селектора. Значения по возрастанию. Нужно...

Зависимость одного dblookupcombobox от двух других
Здраствуйте, у меня ситуация такая, мне нужно настроить...

Нумерация поля таблицы на основе двух других полей
Привет всем! В базе есть таблица nSST, в которой первые три поля называются Np,...

6
amadey18
91 / 91 / 51
Регистрация: 29.04.2013
Сообщений: 361
20.05.2015, 08:41 #2
kos0760, сразу извиняюсь за г--но-код, но работать будет.
http://jsfiddle.net/amadey18/3jjyyqo5/
HTML5
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
45
46
47
48
49
50
51
52
53
54
<span class="krit">Внутренние камеры:</span>
<p style="display: none;" rel="Внутренние камеры"></p>
 <select name="op1" id="op1" onchange="change_select();">
    <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t0">0</option>
    <option value="t1">1</option>
    <option value="t2">2</option>
    <option value="t3">3</option>
    <option value="t4">4</option>
    <option value="t4">5</option>
    <option value="t4">6</option>
    <option value="t4">7</option>
    <option value="t4">8</option>
    <option value="t4">9</option>
    <option value="t4">10</option>
    <option value="t4">11</option>
    <option value="t4">12</option>
    <option value="t4">13</option>
    <option value="t4">14</option>
    <option value="t4">15</option>
   </select>    
     
    
    <span class="krit">Уличные камеры:</span>
    <p style="display: none;" rel="Уличные камеры"></p>
 <select name="op4" id="op4" onchange="change_select();">
 <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t0">0</option>
    <option value="t1">1</option>
    <option value="t2">2</option>
    <option value="t3">3</option>
    <option value="t4">4</option>
    <option value="t4">5</option>
    <option value="t4">6</option>
    <option value="t4">7</option>
    <option value="t4">8</option>
    <option value="t4">9</option>
    <option value="t4">10</option>
    <option value="t4">11</option>
    <option value="t4">12</option>
    <option value="t4">13</option>
    <option value="t4">14</option>
    <option value="t4">15</option>
   </select>
 
   <span class="krit">Видеорегистратор(кан.):</span>
   <p style="display: none;" rel="Видеорегистратор(кан.)"></p>
 <select name="op3" id='op3'>
 <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t1">4</option>
    <option value="t2">8</option>
    <option value="t3">16</option>
    <option value="t4">32</option>  
   </select>
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
function change_select(){
    var sel_1 = document.getElementById('op1');
    var sel_2 = document.getElementById('op4');
    var sel_1_idx;
    var sel_2_idx;
    if(sel_1.options[sel_1.selectedIndex].innerHTML == '') sel_1_idx = 0; 
    else sel_1_idx = sel_1.options[sel_1.selectedIndex].innerHTML;
    if(sel_2.options[sel_2.selectedIndex].innerHTML == '') sel_2_idx = 0; 
    else sel_2_idx = sel_2.options[sel_2.selectedIndex].innerHTML;  
    
    var sum = parseInt(sel_1_idx)+parseInt(sel_2_idx);
    console.log(sum);
    if(sum <= 4)
document.getElementById('op3').options[1].selected=true;
    else if(sum > 4 && sum <= 8)
document.getElementById('op3').options[2].selected=true;
    else if(sum > 8 && sum <= 16)
document.getElementById('op3').options[3].selected=true;  
    else if(sum > 16 && sum <= 32)
document.getElementById('op3').options[4].selected=true;    
}
Рекомендую вместо
Javascript
1
sel_1.options[sel_1.selectedIndex].innerHTML
использовать
Javascript
1
sel_1.value
, так как это правильнее будет, и не нужно будет писать столько текста. Но придется изменить все значения в value, выставить на соответствующие.
1
kos0760
1 / 1 / 0
Регистрация: 01.11.2013
Сообщений: 22
20.05.2015, 13:31  [ТС] #3
Уважаемый, amadey18, Вы мне очень помогли! Ваше решение работает! Не могли бы Вы мне помочь еще в следующем. Как мне сделать так, что если в поле видеорегистратор подставляется к примеру цифра 8, то цифра 4 скрывалась и пользователь не смог бы ее выбрать по ошибке.

Спасибо!
0
amadey18
91 / 91 / 51
Регистрация: 29.04.2013
Сообщений: 361
20.05.2015, 15:06 #4
Лучший ответ Сообщение было отмечено kos0760 как решение

Решение

kos0760, немного подправил.
Надеюсь этого будет достаточно, ибо если в 3-м селекте будет намного больше значений, то нужно будет делать через циклы
http://jsfiddle.net/amadey18/3jjyyqo5/4/
тот же html, но правила форума требуют))
Кликните здесь для просмотра всего текста

HTML5
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
45
46
47
48
49
50
51
52
53
54
<span class="krit">Внутренние камеры:</span>
<p style="display: none;" rel="Внутренние камеры"></p>
 <select name="op1" id="op1" onchange="change_select();">
    <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t0">0</option>
    <option value="t1">1</option>
    <option value="t2">2</option>
    <option value="t3">3</option>
    <option value="t4">4</option>
    <option value="t4">5</option>
    <option value="t4">6</option>
    <option value="t4">7</option>
    <option value="t4">8</option>
    <option value="t4">9</option>
    <option value="t4">10</option>
    <option value="t4">11</option>
    <option value="t4">12</option>
    <option value="t4">13</option>
    <option value="t4">14</option>
    <option value="t4">15</option>
   </select>    
     
    
    <span class="krit">Уличные камеры:</span>
    <p style="display: none;" rel="Уличные камеры"></p>
 <select name="op4" id="op4" onchange="change_select();">
 <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t0">0</option>
    <option value="t1">1</option>
    <option value="t2">2</option>
    <option value="t3">3</option>
    <option value="t4">4</option>
    <option value="t4">5</option>
    <option value="t4">6</option>
    <option value="t4">7</option>
    <option value="t4">8</option>
    <option value="t4">9</option>
    <option value="t4">10</option>
    <option value="t4">11</option>
    <option value="t4">12</option>
    <option value="t4">13</option>
    <option value="t4">14</option>
    <option value="t4">15</option>
   </select>
 
   <span class="krit">Видеорегистратор(кан.):</span>
   <p style="display: none;" rel="Видеорегистратор(кан.)"></p>
 <select name="op3" id='op3'>
 <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t1">4</option>
    <option value="t2">8</option>
    <option value="t3">16</option>
    <option value="t4">32</option>  
   </select>

Javascript
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
45
46
47
48
function change_select(){
    var sel_1 = document.getElementById('op1');
    var sel_2 = document.getElementById('op4');
    var sel_3 = document.getElementById('op3');
    var sel_1_idx;
    var sel_2_idx;
    if(sel_1.options[sel_1.selectedIndex].innerHTML == '') sel_1_idx = 0; 
    else sel_1_idx = sel_1.options[sel_1.selectedIndex].innerHTML;
    if(sel_2.options[sel_2.selectedIndex].innerHTML == '') sel_2_idx = 0; 
    else sel_2_idx = sel_2.options[sel_2.selectedIndex].innerHTML;  
    
    var sum = parseInt(sel_1_idx)+parseInt(sel_2_idx);
    console.log(sum);
    if(sum <= 4){
        sel_3.options[1].selected=true;
        for(var i = 0; i < sel_3.options.length; i++)
        {
            sel_3.options[i].disabled=false;
        };
    }
    else if(sum > 4 && sum <= 8){
        for(var i = 0; i < sel_3.options.length; i++)
        {
            sel_3.options[i].disabled=false;
        };
        sel_3.options[1].disabled=true;    
        sel_3.options[2].selected=true;
    }
    else if(sum > 8 && sum <= 16){
        for(var i = 0; i < sel_3.options.length; i++)
        {
            sel_3.options[i].disabled=false;
        }; 
        sel_3.options[1].disabled=true;    
        sel_3.options[2].disabled=true;  
        sel_3.options[3].selected=true;  
    }
    else if(sum > 16 && sum <= 32){
       for(var i = 0; i < sel_3.options.length; i++)
        {
            sel_3.options[i].disabled=false;
        }; 
        sel_3.options[1].disabled=true;    
        sel_3.options[2].disabled=true;  
        sel_3.options[3].disabled=true;    
        sel_3.options[4].selected=true;   
    } 
}
Добавлено через 40 минут
kos0760, резиновый вариант, теперь количество в селектах может быть любое. Изменил value в 3-м селекте.
http://jsfiddle.net/amadey18/3jjyyqo5/5/
HTML5
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
45
46
47
48
49
50
51
52
53
54
<span class="krit">Внутренние камеры:</span>
<p style="display: none;" rel="Внутренние камеры"></p>
 <select name="op1" id="op1" onchange="change_select();">
    <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t0">0</option>
    <option value="t1">1</option>
    <option value="t2">2</option>
    <option value="t3">3</option>
    <option value="t4">4</option>
    <option value="t4">5</option>
    <option value="t4">6</option>
    <option value="t4">7</option>
    <option value="t4">8</option>
    <option value="t4">9</option>
    <option value="t4">10</option>
    <option value="t4">11</option>
    <option value="t4">12</option>
    <option value="t4">13</option>
    <option value="t4">14</option>
    <option value="t4">15</option>
   </select>    
     
    
    <span class="krit">Уличные камеры:</span>
    <p style="display: none;" rel="Уличные камеры"></p>
 <select name="op4" id="op4" onchange="change_select();">
 <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="t0">0</option>
    <option value="t1">1</option>
    <option value="t2">2</option>
    <option value="t3">3</option>
    <option value="t4">4</option>
    <option value="t4">5</option>
    <option value="t4">6</option>
    <option value="t4">7</option>
    <option value="t4">8</option>
    <option value="t4">9</option>
    <option value="t4">10</option>
    <option value="t4">11</option>
    <option value="t4">12</option>
    <option value="t4">13</option>
    <option value="t4">14</option>
    <option value="t4">15</option>
   </select>
 
   <span class="krit">Видеорегистратор(кан.):</span>
   <p style="display: none;" rel="Видеорегистратор(кан.)"></p>
 <select name="op3" id='op3'>
 <option style="color: #cccccc; display: none;" class="" value="0"></option>
    <option value="4">4</option>
    <option value="8">8</option>
    <option value="16">16</option>
    <option value="32">32</option>  
   </select>
Javascript
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
function change_select(){
    var sel_1 = document.getElementById('op1');
    var sel_2 = document.getElementById('op4');
    var sel_3 = document.getElementById('op3');
    var sel_1_idx;
    var sel_2_idx;
    var sel_idx = 0;
    if(sel_1.options[sel_1.selectedIndex].innerHTML == '') sel_1_idx = 0; 
    else sel_1_idx = sel_1.options[sel_1.selectedIndex].innerHTML;
    if(sel_2.options[sel_2.selectedIndex].innerHTML == '') sel_2_idx = 0; 
    else sel_2_idx = sel_2.options[sel_2.selectedIndex].innerHTML;  
    
    var sum = parseInt(sel_1_idx)+parseInt(sel_2_idx);
    console.log(sum);
    
    // какой индекс нужно взять
    for(var i = 0; i < sel_3.options.length; i++)
    {
        if(parseInt(sel_3.options[i].value) < sum)
            sel_idx = i+1;
        else
            break;// зачем гонять если дальше все числа больше нашей суммы
    }
    // делаем все доступными
    for(var i = 0; i < sel_3.options.length; i++)
    {
        sel_3.options[i].disabled=false;
    };
    // делаем неактивными те что меньше нашего индекса
    for(var i = 0; i < sel_idx; i++)
    {
        sel_3.options[i].disabled=true;
    };
    // выбираем 
    sel_3.options[sel_idx].selected=true;
}
1
kos0760
1 / 1 / 0
Регистрация: 01.11.2013
Сообщений: 22
20.05.2015, 20:34  [ТС] #5
amadey18, знал бы, сразу на этот форум обратился. Не потерял бы неделю времени, причем безрезультатно.

Добавлено через 2 часа 53 минуты
Подскажите, для общего развития, мож в будущем пригодится, как сделать неактивными те значения, что больше, чем то, что подставляется в поле видеорегистратор. сам пытаюсь сделать, не получается. Не хватает пока знаний.
0
alexsamos33
618 / 598 / 325
Регистрация: 26.04.2014
Сообщений: 1,968
20.05.2015, 20:47 #6
.disabled=0 // сделать активным
.disabled=1 // сделать неактивным
0
amadey18
91 / 91 / 51
Регистрация: 29.04.2013
Сообщений: 361
21.05.2015, 08:14 #7
Цитата Сообщение от kos0760 Посмотреть сообщение
как сделать неактивными те значения, что больше,
Javascript
1
2
3
4
5
//те что больше (заменить этот код на тот что делает неактивными)
for(var i = sel_3.options.length-1; i > sel_idx; i--)
    {
        sel_3.options[i].disabled=true;
    };
Цитата Сообщение от alexsamos33 Посмотреть сообщение
.disabled=0 // сделать активным
.disabled=1 // сделать неактивным
это уже дело привычки)) Иногда может сбить с толку, а так сразу видно что булевое значение.
0
21.05.2015, 08:14
MoreAnswers
Эксперт
37091 / 29110 / 5898
Регистрация: 17.06.2006
Сообщений: 43,301
21.05.2015, 08:14

Ввести в базу значения поля по значениям других полей
Вводятся чекбоксами значения &quot;да&quot; в базу данных.. Для них в таблице есть...

Клиент-сервер: Оповещение о событии других классов в зависимости от значения одного из полей
Есть пустыня. В пустыне есть область, где можно добывать полезные ископаемые....

По координатам двух полей определить, являются ли эти поля полями одного цвета
Цвет полей. Поле шахматной доски определяется значением двух координат. По...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
7
Ответ Создать тему
Опции темы

КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin® Version 3.8.9
Copyright ©2000 - 2018, vBulletin Solutions, Inc.
Рейтинг@Mail.ru