Скрыть поля input в зависимости от другого поля

[Twix87]

Добрый день.

Помогите составить js код. Нужно, чтобы остались только поле страна и регион при выборе Российская Федерация. А остальные поля скрывать так:

document.getElementsByClassName('form-group required row-shipping_address_city')[0].style.visibility = 'hidden';
document.getElementsByClassName('form-group required row-shipping_address_address_1')[0].style.visibility = 'hidden';
document.getElementsByClassName('form-group required row-shipping_address_postcode')[0].style.visibility = 'hidden';

Соответственно, если value не 176, то эти поля должны отображаться.

HTML:

<select class="form-control" name="shipping_address[country_id]" id="shipping_address_country_id"
                      <option value=""> --- Выберите --- </option>
                      <option value="20">Белоруссия (Беларусь)</option>
                      <option value="109">Казахстан</option>
                      <option value="115">Киргизия (Кыргызстан)</option>
                      <option value="176" selected="selected">Российская Федерация</option>
                      <option value="226">Узбекистан</option>
</select>

<input class="form-control suggestions-input" type="text" name="shipping_address[city]" id="shipping_address_city" value="";>
<input class="form-control suggestions-input" type="text" name="shipping_address[address_1]" id="shipping_address_address_1" value="";>
<input class="form-control suggestions-input" type="text" name="shipping_address[postcode]" id="shipping_address_postcode" value="";>

JS буду вставлять в simple.

Спасибо.

[Vetroff]

a разве стандартными средствами Simple этого сделать нельзя?

[anboza]

40 минут назад, Vetroff сказал:

a разве стандартными средствами Simple этого сделать нельзя?

может, просто ТС скучно ))

[Twix87]

11 часов назад, Vetroff сказал:

a разве стандартными средствами Simple этого сделать нельзя?

 

10 часов назад, anboza сказал:

может, просто ТС скучно ))

Всем привет. Дело в том, что симпла скрывает поля <input type="hidden">. В таком случае, скрипт dadata, не может подставить адрес в эти поля и значения на сервер не передаются. А если скрывать visibility = 'hidden', то все работает. По этому и возник такой вопрос.
Может тогда можно js научить подставлять значения в <input type="hidden">?

[prived]

25 минут назад, Twix87 сказал:

 

Всем привет. Дело в том, что симпла скрывает поля <input type="hidden">. В таком случае, скрипт dadata, не может подставить адрес в эти поля и значения на сервер не передаются. А если скрывать visibility = 'hidden', то все работает. По этому и возник такой вопрос.
Может тогда можно js научить подставлять значения в <input type="hidden">?

а что мешает взять простой change на jquery и от него отталкиваться? 

[Twix87]

1 час назад, prived сказал:

а что мешает взять простой change на jquery и от него отталкиваться? 

Вот в этом и вопрос. Я два дня пытался, искал похожие решения, но ничего не работает.

$(document).ready(function() {
 $('#shipping_address_country_id').change(function() {
  if($(this).val() === "176")
   {
$("#shipping_address_city").style.visibility = 'hidden';
   }
else
   {
$("#shipping_address_city").css("display", "block");
   }
 });
});

Что то типа этого, пытался сделать.

[Vetroff]

$("#shipping_address_city").hide();
$("#shipping_address_city").show();

 

[prived]

1 час назад, Twix87 сказал:

Вот в этом и вопрос. Я два дня пытался, искал похожие решения, но ничего не работает.

$(document).ready(function() {
 $('#shipping_address_country_id').change(function() {
  if($(this).val() === "176")
   {
$("#shipping_address_city").style.visibility = 'hidden';
   }
else
   {
$("#shipping_address_city").css("display", "block");
   }
 });
});

Что то типа этого, пытался сделать.

я думаю что нужно использовать всегда on 

 

$('тра ля ля').on('change',function(){});

и писать 2 равно будет достаточно 

 

для начала просто напишите change  и выводите в консоль 'работает'

потом пробуйте условия выводить 

а потом все вместе

 

ссылку оставьте

[Vetroff]

13 минут назад, prived сказал:

я думаю что нужно использовать всегда on 

 

 

да это то же самое. 

 

[prived]

1 час назад, Vetroff сказал:

 

да это то же самое. 

 

Для Вас может быть и тоже самое. С опытом прийдет

Только click change и тд не работает с динамически добавленными элементами а on('click') работает и при этом имеет меньшее потребление памяти 

 

еще для отслеживания элемента можно использовать вот такую форму 

$('input').bind("DOMSubtreeModified",function(){});

 

[prived]

Суть в том что click создает отдельный обработчик событий а on - 1 обработчик для каждый on('change') on('click') ну вы поняли ) 

[Twix87]

2 часа назад, Vetroff сказал:

$("#shipping_address_city").hide();
$("#shipping_address_city").show();

 

Мне надо visibility = 'hidden'; как через js добавить? 

В style="display: none; скрипт не может вставить значение.

[Vetroff]

$("#shipping_address_city").css('visibility', 'hidden');

можно и так

[Twix87]

3 минуты назад, Vetroff сказал:

можно и так

Огонь

[Twix87]

https://jsfiddle.net/twix87/95r26z8e/39/

 

Сделал так. Есть проблемка. Страна Россия стоит по умолчанию и нужно это учитывать при загрузке. Сейчас js это не делает и поля видны после загрузки.

[Vetroff]

значит нужно реагировать не только по on change а и сразу по загрузке.

[Twix87]

1 час назад, Vetroff сказал:

значит нужно реагировать не только по on change а и сразу по загрузке.

Я извиняюсь, но как?

[Vetroff]

2 часа назад, Twix87 сказал:

Я извиняюсь, но как?

 

например, так 

 

function hide_fields() {
  if($('#shipping_address_country_id').val() == "176") $("#shipping_address_city, #shipping_address_address_1, #shipping_address_postcode").css('visibility', 'hidden');
  else $("#shipping_address_city, #shipping_address_address_1, #shipping_address_postcode").css('visibility', 'visible');
}

$(document).ready(function() {  
 hide_fields(); 
 $('#shipping_address_country_id').on('change',function() {
 hide_fields();
});
});

 

[Twix87]

2 часа назад, Vetroff сказал:

 

например, так 

@Vetroff спасибо, как всегда выручаешь!