Скрытие/показ формы по radio

Собственно хочу вот, что реализовать:
Когда выбран пункт «Самовывоз» форма «Адрес» скрыта
Когда выбран пункт «Доставка» форма «Адрес» Появляется.

Применил этот скрипт
Сергей Лим
13 ноября 2015, 07:49
modx.pro
1
1 871
+1
Поблагодарить автора Отправить деньги

Комментарии: 8

Алексей Федоров
14 ноября 2015, 11:35
0
Какой
этот скрипт
? Вариант доставки в miniShop2 выводится с id=«delivery_n» по порядку добавления в способы доставки магазина. Например, если Самовывоз есть изначально, а добавили мы только параметр «Доставка», то их у нас будет целых 2.
//Так выглядит конечный результат и от этого будем отталкиваться
<label class="delivery input-parent">
<input type="radio" name="delivery" value="1" id="delivery_1" data-payments="["1","2"]" checked="">
Самовывоз
		<p><small>Товар придет на склад юла-юла-бла</small></p>
	</label>
<label class="delivery input-parent">
<input type="radio" name="delivery" value="2" id="delivery_2" data-payments="["1","2"]" >
Доставка
		<p><small>Привезем под дверь и будет вам счастье!</small></p>
	</label>
Вывод полей корзины стандартно осуществляется чанком tpl.msOrder.outer Советую скопировать и при вызове сниппета msOrder указать новый шаблон вывода (пусть назовем tpl.msOrder.outer2)
Блок вывода адреса начинается со строки 50
<div class="span6 col-md-6">
В нем дописываем id=«adres» и получается (на всякий случай привожу весь блок адреса, мало ли какой у вас уровень знаний html =D)
<div id="adres" class="span6 col-md-6">
			<h4>[[%ms2_frontend_address]]:</h4>
			<div class="form-group input-parent">
				<label class="col-sm-4 control-label" for="index"><span class="required-star">*</span> [[%ms2_frontend_index]]</label>
				<div class="col-sm-4">
					<input type="text" id="index" placeholder="[[%ms2_frontend_index]]"  name="index" value="[[+index]]" class="form-control [[+errors.index]]">
				</div>
			</div>
			<div class="form-group input-parent">
				<label class="col-sm-4 control-label"  for="region"><span class="required-star">*</span> [[%ms2_frontend_region]]</label>
				<div class="col-sm-6">
					<input type="text" id="region" placeholder="[[%ms2_frontend_region]]" name="region" value="[[+region]]" class="form-control [[+errors.region]]">
				</div>
			</div>
			<div class="form-group input-parent">
				<label class="col-sm-4 control-label"  for="city"><span class="required-star">*</span> [[%ms2_frontend_city]]</label>
				<div class="col-sm-6">
					<input type="text" id="city" placeholder="[[%ms2_frontend_city]]" name="city" value="[[+city]]" class="form-control [[+errors.city]]">
				</div>
			</div>
			<div class="form-group input-parent">
				<label class="col-sm-4 control-label"  for="street"><span class="required-star">*</span> [[%ms2_frontend_street]]</label>
				<div class="col-md-6">
					<div class="col-md-4">
						<input type="text" id="street" placeholder="[[%ms2_frontend_street]]" name="street" value="[[+street]]" class="form-control [[+errors.street]]">
					</div>
					<div class="col-md-4">
						<input type="text" id="building" placeholder="[[%ms2_frontend_building]]" name="building" value="[[+building]]" class="form-control [[+errors.building]]">
					</div>
					<div class="col-md-4">
						<input type="text" id="room" placeholder="[[%ms2_frontend_room]]" name="room" value="[[+room]]" class="form-control [[+errors.room]]">
					</div>
				</div>
			</div>
		</div>
Дальше все завит от того, как работает скрипт. Если это обычный js, то он должен по выбору id радиокнопки, показывать/скрывать
В сети порылся и нашел такой код (привожу переделанным под наш случай), его нужно вставить в конце нашего чанка
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<script type="text/javascript">
$(function() {
    $('input[name=delivery]').on('click init-delivery', function() {
        $('#adres').toggle($('#delivery_2').prop('checked'));
    }).trigger('init-delivery');
});
</script>
По нормальному, этот скрипт нужно подключать в шаблоне корзины, а не в чанке, но если захочется вернуться к предыдущей версии вывода, то в шаблоне будет висеть лишний скрипт, так что… ну, это уже ерунда, которая мало относится к делу. Логично предположить, что с новой версией jQquery скрипт будет работать так же хорошо, но я оставил тот, что был в примере (я со скриптовыми языками не дружу, поэтому могу ошибаться, надеюсь в комментариях ниже уточнят этот вопрос). У меня все работает на ура. Если нужно затачивать под неизвестный
этот скрипт
, то ничего не могу сказать ибо ссылки нет.
    Сергей Лим
    16 ноября 2015, 10:38
    +1
    Вот как я сделал в итоге
    Скрипт
    <script type="text/javascript">
    function Show(a) {
            obj=document.getElementById("clientadress");
            if (a==2) obj.style.display="block";
            else obj.style.display="none";
    }
    </script>
    А вот что в Деливерях
    <input type="radio" name="delivery" value="[[+id]]" id="delivery_[[+id]]" data-payments='[[+payments]]' [[+checked]] OnClick=Show([[+id]]);>
      Это сообщение было удалено
        adminixi
        26 января 2017, 18:01
        0
        Подскажите, а как вообще у любого способа доставки скрыть поля, которые не required?
        Лилия
        03 мая 2018, 14:22
        0
        Выдаёт ошибку при оформлении заказа «Вы должны заполнить требуемые поля»…
        Не подскажите как решить?
          Андрей
          03 мая 2018, 14:57
          0
          В настройках минишопа нужно указать какие поля для каждого способа обязательны.
          Лилия
          03 мая 2018, 16:17
          0
          У меня указанно «receiver,phone», и мне не понятно почему у меня заказ оформляется даже когда поля оставить пустыми. Есть мысли?
            Андрей
            03 мая 2018, 16:52
            0
            Такого быть не должно, проверьте работоспособность на чанках по умолчанию, если всё заработает, сравнивайте код и ищите ошибку.
            Лилия
            03 мая 2018, 18:32
            0
            Вынос мозга происходит. С нуля добавляю пункты «Доставка\Самовывоз», вроде всё работает форма появляется\ скрывается. Но появляется ошибка «Вы должны заполнить требуемые поля». Восстанавливаю чанк, который был прежде. Ошибка остаётся =\. Пока БД резервную копию не восстановлю, ошибка остаётся.
              Авторизуйтесь или зарегистрируйтесь, чтобы оставлять комментарии.
              9