弹出模态的动态填充 [英] Dynamic Population of Popup Modal
本文介绍了弹出模态的动态填充的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我有多个像元素一样的按钮,可以打开一个模式弹出窗口.我尝试根据用于打开模式的元素动态填充它.我正在使用JSP和servlet.我还想知道有关向click函数发送参数的信息.
I have multiple button like elements that opens up a single modal popup. I am try to populate it dynamically according to the element that is used to open the modal. I am using JSP and servlets.I would also like to know about sending parameters to the click function.
$('.btn-primary').bind('click', function(event) {
modal.style.display = "block";
});
<div id="myModal" class="modal" style="z-index:4">
<div class="modal-content">
<div class="modal-header">
<span class="close">×</span>
<h4>Submitted List</h4>
</div>
<div class="modal-body">
</div>
</div>
</div>
推荐答案
使用数据属性传递数据
<button class="btn-primary" data-content="this will be displayed in the modal body">
$('.btn-primary').bind('click', function(e) {
e.preventDefault();
var content = $(this).attr('data-content');
$('#myModal').find('.modal-body').html(content);
$('#myModal').modal('show');
});
或通过向servlet传递ID来使用ajax
or use ajax by passing a id to the servlet
<button class="btn-primary" data-id="1">
$('.btn-primary').bind('click', function(e) {
e.preventDefault();
var id= $(this).attr('data-id');
$.ajax({url:'path/to/servlet',data:{id:id},success:function(data){
$('#myModal').find('.modal-body').html(data);
$('#myModal').modal('show');
}})
});
这篇关于弹出模态的动态填充的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!
查看全文