Advanced Hover Settings

Advanced Hover Settings For Joomla Website Builder Gridbox
Mon. - Fri. 9 am - 5 pm Ask a Question
Remember me

Динамическое изменение изображения при вызове формы в модальном окне

2 months 6 days ago #1

  • Vladimir's Avatar
  • Vladimir
  • Posts: 58
Здравствуйте!
Сайт: https://banya.artcolorit.com/

На сайте имеется план территории. При клике на номер беседки открывается модальное окно с формой. В форме первый блок сделал с фото (элемент HTML-код).

Подскажите пожалуйста, можно ли при клике на номер беседки динамически изменять изображение? Пробовал делать таким образом, но что-то не работает. Возможно ошибка в синтаксисе, или блока с формой не существует без клика
$('.plan-block-title a').click(function(){
      //тут получаем ID ссылки
      var id = $(this).attr('id');
      //здесь подставляем изображение
      $('.image-block img').attr('src', 'images/plan/'+id+'.jpg');
   });

Заранее спасибо!

2 months 6 days ago #2

  • Vyacheslav's Avatar
  • Vyacheslav
  • Posts: 19689
Здравствуйте

Скорее всего это не работает потому-что на момент загрузки страницы формы нет,
после первого открытия она появляется и при втором открытии картинка меняется.

Для решения вам нужно вывести форму на страницу.

С уважением,
Вячеслав, Balbooa.com

2 months 6 days ago #3

  • Vladimir's Avatar
  • Vladimir
  • Posts: 58
Понял, благодарю.
То есть, мне необходимо вывести форму на странице, используя стандартный шаблон формы (не лайтбокс).
Но как в таком случае потом запустить форму именно в лайтбоксе?

2 months 6 days ago #4

  • Vyacheslav's Avatar
  • Vyacheslav
  • Posts: 19689
Вам просто нужно добавить форму,
как вы обычно добавляете ее во внешний интерфейс (она не будет видна потому что вы вызываете ее по клику ).
www.balbooa.com/joomla-forms-documentati...form-on-the-frontend

Это необходимо чтобы html был загружен до клика.

С уважением,
Вячеслав, Balbooa.com

2 months 6 days ago #5

  • Vladimir's Avatar
  • Vladimir
  • Posts: 58
Да, сделал так, но к сожалению, вообще перестала меняться фотка и ошибок в консоли при этом нет

2 months 6 days ago #6

  • Vyacheslav's Avatar
  • Vyacheslav
  • Posts: 19689
Вам нужно использовать JS этот код
document.addEventListener('DOMContentLoaded', function(){
    jQuery('.plan-block-title a').on('click', function(){
        jQuery('.image-block img').attr('src', 'images/plan/'+this.id+'.jpg');
    });
});

С уважением,
Вячеслав, Balbooa.com

2 months 6 days ago #7

  • Vladimir's Avatar
  • Vladimir
  • Posts: 58
Вячеслав, огромное вам спасибо за помощь!
Всё получилось, благодарю)

2 months 6 days ago #8

  • Vyacheslav's Avatar
  • Vyacheslav
  • Posts: 19689
Пожалуйста ;)

С уважением,
Вячеслав, Balbooa.com
Powered by Kunena Forum