BootstrapTable의 데이터를 Modal로 보내기
2021. 6. 3. 07:22ㆍ코딩/Java Script
반응형
<div id="myModal" class="modal fade" role="dialog">
<div class="modal-dialog modal-lg">
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title">Modal Header</h4>
<button type="button" class="close" data-dismiss="modal">×</button>
</div>
<div class="modal-body">
<p>Some text in the modal.</p>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
</div>
</div>
<script>
// cell 클릭하면 정보가 있는 modal 팝업
$('#테이블명').on('click-cell.bs.table', function (field, value, row, $el) {
var modal_body = $el.Result;
var modal_title = "Date : " + $el.Date(컬럼명) +"<br>"+ "Name : " + $el.Name(컬럼명)
$(".modal .modal-title").html('<p class="small-font">'+ modal_title + '</p>');
$(".modal .modal-body").html('<p class="small-font">' + modal_body + '</p>');
$(".modal").modal("show");
});
</script>
반응형
'코딩 > Java Script' 카테고리의 다른 글
JavaScript를 이용하여 Json File을 HTML에 삽입하는 방법 (0) | 2022.04.04 |
---|---|
SweetAlert2 이용하여 HTML alert 창 꾸미기 (0) | 2022.02.19 |
bootstrap selectpicker dropdown below 처리 (0) | 2022.01.28 |
jQuery id 표기방법 (0) | 2022.01.28 |
BootstrapTable 에 버튼으로 구성된 열 추가 (linkFormatter) (0) | 2021.06.03 |