[Jquery] modal LayerPopup간 데이터 주고 받기

기본적으로 팝업을 구현할 때 window.open을 통해 뜨는 팝업을 좋아하지 않아서, modal을 이용한 LayerPopup으로 구현을 하는 편인데,

단순히 팝업을 하나 출력할 때는 아무문제 없는데, 데이터를 주고 받아야하는 경우가 있다. 데이터 편집 등.. seq 값을 넘겨야하는 경우라고 이해하면 편할 것 같다.

a 태그를 이용하여, custom attribute를 선언하여 주고받을 수 있는 방법이 있어서, 그 방법에 대해 알아본다.

편의상 LayerPopup만드는법은 생략하고, LayerPopup의 id는 testModal로 했다고 가정한다.

1. 데이터를 넘길 a 태그 작성

<a href="#" data-toggle="modal" data-target="#testModal" data-id="1">

2. modal (LayerPopup)을 누른 후 data-id 불러오기

$(document).ready(function() {		
    $('#testModal').on('show.bs.modal', function(event) {			
        var seq = $(event.relatedTarget).data('id');
    });
});

이와 같이 구현하면, a 태그를 눌러서 뜬 modal에서 데이터를 받아서 활용이 가능하다. 

data-id는 정해진건 아닌거 같고, data-{변수} 형태로 넘길 수 있는 것 같다.