模态框html
<!--弹出修改蛋糕窗口-->
<div class="modal fade" id="reviseCake" role="dialog" aria-labelledby="gridSystemModalLabel">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="gridSystemModalLabel">修改蛋糕</h4>
</div>
<div class="modal-body">
<div class="container-fluid">
<form class="form-horizontal" id="updatecakeform" >
<div class="form-group ">
<label for="sName" class="col-xs-3 control-label">编号:</label>
<div class="col-xs-8 ">
<input type="email" class="form-control input-sm duiqi" id="cakeid" placeholder="" name="cakeid"">
</div>
</div>
<div class="form-group">
<label for="sLink" class="col-xs-3 control-label">名称:</label>
<div class="col-xs-8 ">
<input type="" class="form-control input-sm duiqi" id="cName" placeholder="" name="cName">
</div>
</div>
<div class="form-group">
<label for="sOrd" class="col-xs-3 control-label">价格:</label>
<div class="col-xs-8">
<input type="" class="form-control input-sm duiqi" id="cPrice" placeholder="" name="cPrice">
</div>
</div>
<div class="form-group">
<label for="sKnot" class="col-xs-3 control-label">节日:</label>
<div class="col-xs-8">
<input type="" class="form-control input-sm duiqi" id="cFestival" placeholder="" name="cFestival">
</div>
</div>
<div class="form-group">
<label for="sKnot" class="col-xs-3 control-label">上传图片:</label>
<div class="col-xs-8">
<input type="" class="form-control input-sm duiqi" id="cImage" placeholder="" name="cImage">
</div>
</div>
<div class="form-group">
<label for="sKnot" class="col-xs-3 control-label">库存:</label>
<div class="col-xs-8">
<input type="" class="form-control input-sm duiqi" id="amount" placeholder="" name="amount">
</div>
</div>
</form>
</div>
</div>
<div class="modal-footer">
<form action="UpdateCake">
<button type="button" class="btn btn-xs btn-white" data-dismiss="modal">取 消</button>
<button type="button" class="btn btn-xs btn-green" onclick="updateCake()">保 存</button>
</form>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
按钮
div class="col-xs-2">
<button class="btn btn-success btn-xs" id="update" data-toggle="modal" data-id="${cake.cakeId}" data-target="#reviseCake" >修改</button>
<button class="btn btn-danger btn-xs" id="delete" data-toggle="modal" data-target="#deleteCake" data-id="${cake.cakeId}" >删除</button>
</div>
JS代码
$('#reviseCake').on('show.bs.modal', function (event) {
var a = $(event.relatedTarget)
var id = button.data('id')
var modal = $(this)
modal.find('.modal-title').text('New message to ' + id)
modal.find('.modal-body input').val(id)
});
效果