Добавление значения JS obj в модал - PullRequest
Новая
       12

Добавление значения JS obj в модал

0 голосов
/ 30 апреля 2019

У меня есть несколько div, которые были клонированы из одного шаблона, и каждый div содержит заголовок. Данные заголовка поступают из объекта JS.

При нажатии на любой из заголовков / разделов открывается модальное окно, и я хочу, чтобы заголовок также отображался в модальном.

Я думаю, что проблема в том, что $template.find не может "найти" модал, если это имеет смысл, и мне интересно, связано ли это с тем, что модал не отображается до onClick срабатывает.

С учетом сказанного, как я могу добавить правильный заголовок в правильный модал? Например, при нажатии на раздел «Животные» открывается модальное окно, и я также вижу заголовок «Животные».

Фрагмент JS: 

loadCategories(){
        let categs = _categories,
            libCrs = _library

            console.log(libCrs);

            let $host = $("#host");
            for (var i = 0; i < categs.length; i++) {
                let $template = $("#template").clone();
                $template.find(".cat-box > .cat-title").text(categs[i].Title);
                $template.find(".modal-content > .modal-title").text(categs[i].Title);
                $host.append($template.html());
            }

    let container = document.querySelector("div#template");
        container.innerHTML = $host;
        console.log(container);            
    }

Фрагмент HTML: 

<div id="template" style="display:none">
            <div class="cat-box" data-target="#modal-id" data-toggle="modal">
                <h3 class="cat-title"></h3>
            </div>
        </div>

        <div id="host"></div>

          <!----- Modal ----->
            <div class="modal-title" id="exampleModalLabel"></div>

            <div class="modal-body">
              <div class="category-desc"></div>
              <div class="training-titles">
                <ul class="training-titles-ul">

                </ul>
              </div>
            </div>
...