Как передать значение данных из Bootstrap Modal в родительскую форму

Question

Как передать атрибут данных или щелкнуть событие из Bootstrap modal в родительскую форму/окно.

, например, При нажатии на поле ввода ниже, модальный будет всплывать с дивы, имеющих данные атрибутов

<input type="text" name="menu_image_id" class="form-control" data-toggle="modal" data-target=".show_modal_w" /> 

<input type="text" name="menu_image_id_2" class="form-control" data-toggle="modal" data-target=".show_modal_w" /> 

модальное окно

<div class="modal fade show_modal_w" tabindex="-1" role="dialog"> 
    <div class="modal-dialog modal-lg" role="document"> 
     <div data-id="1" data-dismiss="modal">Hello</div> 
     <div data-id="2" data-dismiss="modal">Welcome</div> 
     <div data-id="3" data-dismiss="modal">Morning</div> 
    </div> 
</div> 

Теперь, когда пользователь нажимает на DIV внутри модального например, Hello, Welcome или Morning, тогда нам нужно передать значение id из модального в родительское поле ввода с именем menu_image_id.

Я попытался использовать функцию закрытия ниже, но не смог получить идентификатор модальных данных в родительском окне.

$('.show_modal_w').on('hidden.bs.modal', function (e) { 
    $(e.relatedTarget); 
}) 

Answer 1

Я пытаюсь по-другому, чем вы делали,

вместо того, чтобы захватить hidden.bs.modal, я захватывая div.on.click, поэтому вместо того, чтобы:

$('.show_modal_w').on('hidden.bs.modal', function (e) { 
    $(e.relatedTarget); 
}) 

Я написал

$("body").on("click", ".show_modal_w div[data-id]", function() { 
    $("input[name='menu_image_id']").val($(this).data("id") + " - " + $(this).text()); 
    $(".show_modal_w").modal("hide"); 
}); 

А вот jsfiddle: https://jsfiddle.net/f9urohoo/ я поставил идентификатор и текст div нажал на вход с именем [name = "menu_image_id"], но вы можете адаптировать его по своему усмотрению.

Сообщите мне, если это то, что вы хотели