Передача переменной в модальное окно


Задача при клике на ссылку передать в модальное окно данные или переменную.

Все просто если ссылка одна, а когда несколько ссылок то выход сделать несколько модальных окон чтобы каждая ссылка открывала своё окно, но если ссылки динамические, количество их не постоянное и данные постоянно меняются то можно передать переменную, GET или POST параметр используя java script.

<button><a id="ModalWindow">Удалить навсегда!</a></button>  <!-- элемент модального окна с id=ModalWindow -->
 
 
 
<a id="2" data-target="#modal" onclick="modal_data(this.id)"></a> <!-- ссылка открывает модальное окно #modal и передает скрипту значение которое храниться в id-->
 
 
<script type="text/javascript">
  function modal_data(id) { //скрипт получает значение id из ссылки по которой мы кликнули
    var a = document.getElementById("ModalWindow"); // ищем элемент с id ModalWindow
    a.setAttribute("href", "?id="+id); // устанавливаем ему атрибут href и присваиваем ему значение ?id=2 
  }
</script>

Скрипт нужно разместить внизу страницы перед закрывающимся тэгом body

Теперь можно генерировать нужное количество ссылок и при клике на любую из них окроется модальное окно с подставленым в него атрибутом href и с правильным значением сгенерированным из id ссылки


#web #java #php
Просмотров: 440

comments powered by HyperComments



Поиск по сайту