Перейти к содержимому


Галочка "согласен" В Корзине + Всплывающее Окно С Текстом Соглашения

соглашение

  • Авторизуйтесь для ответа в теме
Сообщений в теме: 24

#1 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 19 Ноябрь 2013 - 08:31

Здравствуйте!

Есть необходимость добавить в корзину галочку "Согласен с условиями поставки".
Текст "согласен с условиями поставки" должен быть кликабельным и при нажатии на него должно открываться всплывающее окно с текстом соглашения.
Без установленной галочки "согласен..." кнопка оформления заказа неактивна.

Пример работы элемента можно посмотреть в корзине на сайте evrorazbor.com (скриншот во вложении).

Здесь на форуме находила похожую тему - там предлагалось текст соглашения вставить прямо на страницу корзины. Это не совсем то - нужно именно всплывающее окно.
Помогите сделать, пожалуйста.

Прикрепленные изображения

  • korzina.png


#2 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 19 Ноябрь 2013 - 15:49

Панель администратора, "Сайт"->"Редактор Шаблонов".
В конец файла "main.js".
Добавить код:
$(function(){
$('.right .whtblue').attr('disabled', 'disabled');
$('#s1').click(function(){
console.log($(this).attr('checked'));
if($(this).attr('checked') == true ) {
$.fancybox($('.t1').html());
$('.right .whtblue').removeAttr('disabled');

} else {
$('.right .whtblue').attr('disabled', 'disabled');
}
});

});
И в файле "Корзина". После кода:
<div class="left" ><a href="{CART_TRUNCATE_URL}" class="whtgreen" onclick="return confirm('Вы действительно хотите удалить все товары из корзины?')">Очистить корзину</a> <button class="whtgreen fnt12n" type="submit" >Пересчитать</button></div>
	  <div class="right">
Добавить код:
<label for="s1">Согласен: </label>
	  <input type="checkbox" id="s1" />
	  <div class="t1" style="display:none;">
		<div id="text-s1">
		  Тут текст соглашения.
		</div>
	  </div>


#3 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 20 Ноябрь 2013 - 09:28

Спасибо!
Сделала все так, но текст соглашения нигде не выводится. Слово "Согласен" нажать нельзя, чтобы открылся этот текст.

Да и кнопку "Заказать" можно нажать, даже если галочка "согласен" не стоит. А она должна быть доступна только с галочкой в комплекте.

#4 ogonek7777

ogonek7777

    Активный участник

  • Пользователи
  • PipPipPipPip
  • 2 109 сообщений
  • ГородМосква

Отправлено 20 Ноябрь 2013 - 11:51

У меня в подписи тема Помощь бесплатно - там среди списка тем есть и Ваша. Извините, самой искать лениво, поройтесь и найдете готовый ответ)

#5 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 20 Ноябрь 2013 - 12:22

Спасибо, эту тему я уже читала. Там предлагается блок с текстом соглашения вставить прямо на странице корзины.
Мне нужно, чтобы этот текст был во всплывающем окне. Окно должно всплывать при нажатии на ссылку-слово "Соглашение".

#6 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 21 Ноябрь 2013 - 02:43

как вариант совместить инструкцию, которую у себя в теме разместила ogonek7777 по поводу текста соглашения со сл.инструкцией:
- спойлер: http://blogger.com.m...70-spoiler.html
- вспл.окно: http://forum.storela...окно/#entry7693

#7 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 21 Ноябрь 2013 - 07:55

В инструкции со всплывающим окном окно всплывает автоматически при открытии страницы. Нужно, чтобы оно всплывало по клику на слово "согласен".

#8 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 21 Ноябрь 2013 - 14:04

Просмотр сообщенияbergamota (21 Ноябрь 2013 - 07:55) писал:

В инструкции со всплывающим окном окно всплывает автоматически при открытии страницы. Нужно, чтобы оно всплывало по клику на слово "согласен".
Из сообщения http://forum.storela...но/#entry104606 все должно работат. Выполнил у себя в шаблоне по этой инструкции. Очистил кеш браузера и проверил. Все работает нормально.
Пока пользователь не отметит галочкой "Согласен" кнопка заказать у него сработает. Естественно все это у него будет работать только пока включен js в браузере.

#9 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 21 Ноябрь 2013 - 14:13

Неужели кэш так влияет? Спасибо, заработало!

А можно ли текст соглашения подгружать из загруженной в "файлы" html страницы в это всплывающее окно? Он очень длинный, ищу варианты не писать его в коде корзины, а подгружать извне.

#10 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 21 Ноябрь 2013 - 18:27

Просмотр сообщенияbergamota (21 Ноябрь 2013 - 14:13) писал:

Неужели кэш так влияет? Спасибо, заработало!

А можно ли текст соглашения подгружать из загруженной в "файлы" html страницы в это всплывающее окно? Он очень длинный, ищу варианты не писать его в коде корзины, а подгружать извне.
Да возможно.
Вам нужно будет в раздел Сайт -> Файлы загрузить html файл из архива предварительно изменив его содержание в текстовом редакторе.
А затем изменить код в файле "main.js".

Найти код:
$(function(){
$('.right .whtblue').attr('disabled', 'disabled');
$('#s1').click(function(){
console.log($(this).attr('checked'));
if($(this).attr('checked') == true ) {
$.fancybox($('.t1').html());
$('.right .whtblue').removeAttr('disabled');

} else {
$('.right .whtblue').attr('disabled', 'disabled');
}
});

});
Заменить:
$(function(){
  $('.right .whtblue').attr('disabled', 'disabled');
  $('#s1').click(function(){
	console.log($(this).attr('checked'));
	if($(this).attr('checked') == true ) {

	  $.get('тут адрес до html файла с текстом', function(d){
		var t = $(d).find('.s1').html();
		$.fancybox(t);
	  })
	  $('.right .whtblue').removeAttr('disabled');

	} else {
	  $('.right .whtblue').attr('disabled', 'disabled');
	}
  });
});

Прикрепленные файлы

  • Прикрепленный файл  test.zip   405байт   107 Количество загрузок:


#11 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 22 Ноябрь 2013 - 09:04

Сделала. Сайт выдает JS ошибку. При нажатии галочки теперь ничего не происходит.
Может, в корзине тоже что-то нужно было поменять?

#12 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 22 Ноябрь 2013 - 11:58

Просмотр сообщенияbergamota (22 Ноябрь 2013 - 09:04) писал:

Сделала. Сайт выдает JS ошибку. При нажатии галочки теперь ничего не происходит.
Может, в корзине тоже что-то нужно было поменять?
Попробуйте загрузить файл test.html  в раздел редактор шаблонов. И соответственно поменять ссылку в коде.

#13 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 22 Ноябрь 2013 - 12:02

Сделала. Ситуация не изменилась. Окно не всплывает, галочка ставится, кнопка "заказать" не активна и при нажатой галочке.

#14 Сake

Сake

    Активный участник

  • Модератоpы
  • 5 979 сообщений

Отправлено 23 Ноябрь 2013 - 00:50

Вам необходимо создать страницу в разделе Сайт -> Страницы и поместить в страницу содержимое вашего файла dogovor-kupli-prodazhi.html вставить содержимое HTML можно нажав кнопку "Источник" на панели визуального редактора. После этого в файле main.js найдите строку

$.get('http://design.avtostekla-v-ekb.ru/dogovor-kupli-prodazhi.html?0745', function(d)

и замените данную строку на ссылку созданной страницы вида

$.get('http://avtostekla-v-ekb.ru/page/dogovor-kupli-prodazhi?only_body', function(d)

на данный момент доступ к документу невозможен по причине кроссдоменного запроса.

#15 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 23 Ноябрь 2013 - 21:32

Сделала, ничего не поменялось.
Потом убрала ?only_body - тоже ничего не поменялось, 1 js ошибка на сайте, текст не выводится. Но теперь хотя бы при нажатии галочки "согласен" кнопка "заказать" работает.

#16 Koderhan

Koderhan

    Активный участник

  • Модератоpы
  • 6 227 сообщений

Отправлено 25 Ноябрь 2013 - 14:47

Просмотр сообщенияbergamota (23 Ноябрь 2013 - 21:32) писал:

Сделала, ничего не поменялось.
Потом убрала ?only_body - тоже ничего не поменялось, 1 js ошибка на сайте, текст не выводится. Но теперь хотя бы при нажатии галочки "согласен" кнопка "заказать" работает.
Попробуйте на странице "Договор поставки" через кнопку "Источник" обвернуть все содержимое страницы в тег:
<div class="s1">
Тут содержимое страницы...
</div>


#17 bergamota

bergamota

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 166 сообщений

Отправлено 25 Ноябрь 2013 - 14:57

Помогло, большое спасибо!

#18 working_working

working_working

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 188 сообщений

Отправлено 14 Февраль 2015 - 17:16

Добрый вечер.

Тоже пытаюсь сделать проставление галочки с соглашением (а именно: кнопка "оформить заказ" должна быть "погашенной" и на нее нельзя нажать. При проставлении галочки, она "загорается" т.е. приобретает свой нормальный цвет и можно на нее нажать и перейти на следующий шаг. Само название перед галочкой, в моем случае: "С договором на оказание услуг согласен (-на)" должно подчеркиваться при наведении и переходить на выбранную страницу в новом окне.

Читал смежные темы, но как сделать в Нефрите немного не понял.

На данный момент текст галочки уезжает за кнопку (скрин приложил).
1. Как сделать, чтобы текст был рядом с галочкой.
2. Кнопка "оформить заказ" должна быть "погашенной" и на нее нельзя нажать. При проставлении галочки, она "загорается" т.е. приобретает свой нормальный цвет и можно на нее нажать и перейти на следующий шаг.

Шаблон Нефрит. Магазин:

SL-1045268



Я вставил в main.js такой код:
$(function(){
$('.right .whtblue').attr('disabled', 'disabled');
$('#s1').click(function(){
console.log($(this).attr('checked'));
if($(this).attr('checked') == true ) {
$.fancybox($('.t1').html());
$('.right .whtblue').removeAttr('disabled');

} else {
$('.right .whtblue').attr('disabled', 'disabled');
}
});

});

и в корзине перед:
<a class="btn" title="Очистить корзину" href="{CART_TRUNCATE_URL}">Очистить корзину</a>

вот такой код:


<label for="s1"><a class="test" href="http://s1045268.stor...rget="_blank">С договором на оказание услуг согласен(-на)</a></label>
<input type="checkbox" id="s1" />
  <div class="t1" style="display:none;">
<div id="text-s1">
  Тут текст соглашения.
</div>
  </div>

Прикрепленные изображения

  • 11.JPG


#19 working_working

working_working

    Продвинутый пользователь

  • Пользователи
  • PipPipPip
  • 188 сообщений

Отправлено 16 Февраль 2015 - 19:13

Просмотр сообщенияworking_working (14 Февраль 2015 - 17:16) писал:

Добрый вечер.

Тоже пытаюсь сделать проставление галочки с соглашением (а именно: кнопка "оформить заказ" должна быть "погашенной" и на нее нельзя нажать. При проставлении галочки, она "загорается" т.е. приобретает свой нормальный цвет и можно на нее нажать и перейти на следующий шаг. Само название перед галочкой, в моем случае: "С договором на оказание услуг согласен (-на)" должно подчеркиваться при наведении и переходить на выбранную страницу в новом окне.

Читал смежные темы, но как сделать в Нефрите немного не понял.

На данный момент текст галочки уезжает за кнопку (скрин приложил).
1. Как сделать, чтобы текст был рядом с галочкой.
2. Кнопка "оформить заказ" должна быть "погашенной" и на нее нельзя нажать. При проставлении галочки, она "загорается" т.е. приобретает свой нормальный цвет и можно на нее нажать и перейти на следующий шаг.

Шаблон Нефрит. Магазин:

SL-1045268



Я вставил в main.js такой код:
$(function(){
$('.right .whtblue').attr('disabled', 'disabled');
$('#s1').click(function(){
console.log($(this).attr('checked'));
if($(this).attr('checked') == true ) {
$.fancybox($('.t1').html());
$('.right .whtblue').removeAttr('disabled');

} else {
$('.right .whtblue').attr('disabled', 'disabled');
}
});

});

и в корзине перед:
<a class="btn" title="Очистить корзину" href="{CART_TRUNCATE_URL}">Очистить корзину</a>

вот такой код:


<label for="s1"><a class="test" href="http://s1045268.stor...rget="_blank">С договором на оказание услуг согласен(-на)</a></label>
<input type="checkbox" id="s1" />
  <div class="t1" style="display:none;">
<div id="text-s1">
  Тут текст соглашения.
</div>
  </div>

Кто-нибудь может помочь? :)

#20 Vaccina

Vaccina

    Активный участник

  • Модераторы
  • 23 788 сообщений

Отправлено 17 Февраль 2015 - 01:29

В шаблоне Корзина найдите:
</tr>
			<tr>
			  <td colspan="50">
				<div class="buttons">
			   
				  <a class="btn form-submit" title="Пересчитать">Пересчитать</a>
				 
	   
				 
				  <a class="btn" title="Очистить корзину" href="{CART_TRUNCATE_URL}">Очистить корзину</a>
				 
				<label for="s1"><a class="test" href="http://s1045268.storeland.ru/page/Доставка"  target="_blank">С договором на оказание услуг согласен(-на)</a></label>
					 <input type="checkbox" id="s1" />
		  <div class="t1" style="display:none;">
				<div id="text-s1">
				  Тут текст соглашения.
				</div>
		  </div>
				 
				  <a class="btn form-submit denybot" title="Перейти к оформлению заказа">Оформить заказ</a>
замените на:
</tr>
<tr>
			  <td colspan="50">
		<div class="t1">
				<div id="text-s1">
				  Тут текст соглашения.
				</div>
		  </div>
				<label for="s1"><a class="test" href="http://s1045268.storeland.ru/page/Доставка"  target="_blank">С договором на оказание услуг согласен(-на)</a></label>
				<input type="checkbox" id="s1" />
		 
	 </td>
</tr>
			<tr>
			  <td colspan="50">
				<div class="buttons">
			   
				  <a class="btn form-submit" title="Пересчитать">Пересчитать</a>
				 
				  <a class="btn" title="Очистить корзину" href="{CART_TRUNCATE_URL}">Очистить корзину</a>
			  
				  <a class="btn form-submit denybot" title="Перейти к оформлению заказа">Оформить заказ</a>

Далее js код:
$(function(){
$('.right .whtblue').attr('disabled', 'disabled');
$('#s1').click(function(){
console.log($(this).attr('checked'));
if($(this).attr('checked') == true ) {
$.fancybox($('.t1').html());
$('.right .whtblue').removeAttr('disabled');
} else {
$('.right .whtblue').attr('disabled', 'disabled');
}
});
});
замените на:
$(function(){
$('.form-submit.denybot').attr('disabled', 'disabled');
$('#s1').click(function(){
console.log($(this).attr('checked'));
if($(this).attr('checked') == true ) {
$.fancybox($('.t1').html());
$('.form-submit.denybot').removeAttr('disabled');
} else {
$('.form-submit.denybot').attr('disabled', 'disabled');
}
});
});





Количество пользователей, читающих эту тему: 0

0 пользователей, 0 гостей, 0 анонимных