Javascript.RU

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

Как вылечить появление и исчезновение блоков в коде js?
Друзья, есть js.


<div id="f_lr1ro" class="field ft_list">
<label for="lr1ro">Есть ли у вас авто</label><select name="lr1ro" id="lr1ro">
	<option value="1">--</option>
	<option value="2">Есть</option>
	<option value="3">Нет</option>
	<option value="4">Не нужно совсем</option>
</select>
</div>

<div id="f_lr1rowtd" class="field ft_list">
<label for="lr1rowtd">Авто</label><select name="lr1rowtd" id="lr1rowtd">
	<option value="1">--</option>
	<option value="2">Ничего не делать</option>
	<option value="3">окрасить</option>
	<option value="4">Перебрать/отремонтировать</option>
	<option value="5">Поменять на легковую</option>
	<option value="6">Поменять на бус</option>
	<option value="7">Поменять на мото</option>
	<option value="8">Поменять на джип</option>
	<option value="9">Купить на легковую</option>
	<option value="10">Купить на бус</option>
	<option value="11">Купить на джип</option>
	<option value="12">Купить на мото</option>
</select>
</div>

<div id="f_lr1rooq" class="field ft_number">
<label for="lr1rooq">Сколько лет авто</label>
<input type="text" class="input input-number" name="lr1rooq" value="" id="lr1rooq" size="5">
</div>

<div id="f_lr1ronq" class="field ft_number">
<label for="lr1ronq">Какой пробег нужен</label>
<input type="text" class="input input-number" name="lr1ronq" value="" id="lr1ronq" size="5">
</div>



var update = function() {
    var val = +$('#f_lr1ro option:selected').val();
    var showFirst = [2, 3].indexOf(val) >= 0; 
    $('#f_lr1rowtd').toggle(showFirst); 
};
var update2 = function() {
    var val = +$('#f_lr1rowtd option:selected').val();
    var showFirst = [3, 4, 5, 6, 7, 8].indexOf(val) >= 0; 
    var showSecond = [9, 10, 11, 12].indexOf(val) >= 0; 
    $('#f_lr1rooq').toggle(showFirst);
    $('#f_lr1ronq').toggle(showSecond);
};
$(document).ready(function(){
    $('#f_lr1ro').change(update);
    $('#f_lr1rowtd').change(update2);
    update();
    update2();
});


Все работает прекрасно, но есть одна оказия, которая не дает радоваться этому коду.
Если в первом списке с #f_lr1ro ("Есть ли у вас авто") мы выбрали, например, 2 - "ЕСТЬ"
Появляется второй список с #f_lr1rowtd. (АВТО) Тут все в порядке.
После того как во втором списке (АВТО), который появился я выбираю, например, 3 - "ОКРАСИТЬ"
Появляется поле с #f_lr1rooq (СКОЛЬКО ЛЕТ АВТО)- тут тоже все работает.

Когда я в первом списке #f_lr1ro, "2" - "ЕСТЬ" изменяю на "1" "--"
Второй список #f_lr1rowtd ("АВТО") исчезает - все как нужно.
НО! при этом поле #f_lr1rooq (СКОЛЬКО ЛЕТ АВТО) уже не исчезает.
Как я понимаю, это из за того, что в исчезнувшем списке (АВТО) выбрана и сохранена позиция ("ОКРАСИТЬ"), при которой это поле (СКОЛЬКО ЛЕТ АВТО) должно показываться. Как это лечится?

Последний раз редактировалось adash, 31.03.2015 в 23:33.
Ответить с цитированием
  #2 (permalink)  
Старый 31.03.2015, 22:44
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

adash,
1 полноценный макет
2 что хотел сделать с помощью этого кода?
Ответить с цитированием
  #3 (permalink)  
Старый 31.03.2015, 23:22
Аспирант
Отправить личное сообщение для adash Посмотреть профиль Найти все сообщения от adash
 
Регистрация: 31.03.2015
Сообщений: 38

Сообщение от рони Посмотреть сообщение
adash,
1 полноценный макет
2 что хотел сделать с помощью этого кода?
Макет в первом сообщении.
Хотел сделать зависимость появления и исчезновения блоков в зависимости от выбранных пунктов выпадающего списка.

Вот ссылка на пример http://jsfiddle.net/adash/8z51m437/

Последний раз редактировалось adash, 01.04.2015 в 00:08.
Ответить с цитированием
  #4 (permalink)  
Старый 01.04.2015, 00:13
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

adash,
в конец 4 строки добавить
!showFirst  && $('#f_lr1rowtd select').val(1).change();


мысли вслух -- '#f_lr1ro option:selected' и $('#f_lr1ro').change нафига?
Ответить с цитированием
  #5 (permalink)  
Старый 01.04.2015, 00:20
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

adash,
<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
$(function() {
         var update = function() {
             var val = +this.value;
             var showFirst = [2, 3].indexOf(val) >= 0;
             $('#f_lr1rowtd').toggle(showFirst);
             !showFirst && $('#f_lr1rowtd select').val(1).change();
         };
         var update2 = function() {
             var val = +this.value;
             var showFirst = [3, 4, 5, 6, 7, 8].indexOf(val) >= 0;
             var showSecond = [9, 10, 11, 12].indexOf(val) >= 0;
             $('#f_lr1rooq').toggle(showFirst);
             $('#f_lr1ronq').toggle(showSecond);
         };
         $('#lr1ro').change(update).change();
         $('#lr1rowtd').change(update2).change();
     });
  </script>
</head>

<body>  <div id="f_lr1ro" class="field ft_list">
<label for="lr1ro">Есть ли у вас авто</label><select name="lr1ro" id="lr1ro">
	<option value="1">--</option>
	<option value="2">Есть</option>
	<option value="3">Нет</option>
	<option value="4">Не нужно совсем</option>
</select>
</div>

<div id="f_lr1rowtd" class="field ft_list">
<label for="lr1rowtd">Авто</label><select name="lr1rowtd" id="lr1rowtd">
	<option value="1">--</option>
	<option value="2">Ничего не делать</option>
	<option value="3">окрасить</option>
	<option value="4">Перебрать/отремонтировать</option>
	<option value="5">Поменять на легковую</option>
	<option value="6">Поменять на бус</option>
	<option value="7">Поменять на мото</option>
	<option value="8">Поменять на джип</option>
	<option value="9">Купить на легковую</option>
	<option value="10">Купить на бус</option>
	<option value="11">Купить на джип</option>
	<option value="12">Купить на мото</option>
</select>
</div>

<div id="f_lr1rooq" class="field ft_number">
<label for="lr1rooq">Сколько лет авто</label>
<input type="text" class="input input-number" name="lr1rooq" value="" id="lr1rooq" size="5">
</div>

<div id="f_lr1ronq" class="field ft_number">
<label for="lr1ronq">Какой пробег нужен</label>
<input type="text" class="input input-number" name="lr1ronq" value="" id="lr1ronq" size="5">
</div>



</body>

</html>
Ответить с цитированием
  #6 (permalink)  
Старый 01.04.2015, 01:35
Аспирант
Отправить личное сообщение для adash Посмотреть профиль Найти все сообщения от adash
 
Регистрация: 31.03.2015
Сообщений: 38

рони,
Замечательно! Огромнейшее спасибо ВАМ!!!
А можно узнать, возможно ли сделать так, чтобы в зависимости от выбора одного value из одного списка, value из другого скрывался?

Наверное нужно более конкретно.
В списке "Есть ли у вас авто" при выборе "Есть" необходимо чтобы в списке "Авто" исчезли
<option value="9">Купить на легковую</option>
<option value="10">Купить на бус</option>
<option value="11">Купить на джип</option>
<option value="12">Купить на мото</option>


А при выборе "Нет" -
<option value="3">окрасить</option>
<option value="4">Перебрать/отремонтировать</option>
<option value="5">Поменять на легковую</option>
<option value="6">Поменять на бус</option>
<option value="7">Поменять на мото</option>
<option value="8">Поменять на джип</option>
Ответить с цитированием
  #7 (permalink)  
Старый 01.04.2015, 01:51
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,068

adash,
можно но неинтересно ищите зависимые селекты по форуму их много
Ответить с цитированием
  #8 (permalink)  
Старый 01.04.2015, 02:03
Аспирант
Отправить личное сообщение для adash Посмотреть профиль Найти все сообщения от adash
 
Регистрация: 31.03.2015
Сообщений: 38

Ок, буду разбираться. Но на форуме что-то ничего не нашел. Спасибо!
Ответить с цитированием
  #10 (permalink)  
Старый 01.04.2015, 02:27
Аспирант
Отправить личное сообщение для adash Посмотреть профиль Найти все сообщения от adash
 
Регистрация: 31.03.2015
Сообщений: 38

Темный лес. Ей богу. В php первые шаги только осилил. js код, который выложил - за неделю выстрадал. А с вашими ссылками еще на неделю зависну.

Дело в том, что тяжело догоняю js. М да... В любом случае спасибо.
Ответить с цитированием
Ответ



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

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


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как узнать домен из js? MakTpaxep Общие вопросы Javascript 3 14.10.2016 14:22
Как передавать параметры из php скрипта в js imissyouso Общие вопросы Javascript 3 01.08.2012 18:24
ошибка в js коде timotheus Элементы интерфейса 3 23.05.2012 09:02
Как получит ссылку на элемент внутри которого запустили JS код? aRpi Events/DOM/Window 20 02.10.2011 13:36
Подскажите как при помощи JS hta в трею свернуть kimboo Общие вопросы Javascript 4 11.07.2008 16:00