bootstrap modal

<div class="modal fade" id="updateModal" tabindex="-1" role="dialog" style="margin-top: 50px;">
<div class="modal-dialog" role="document" style=" 500px">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal"><span>&times;</span></button>
<h4 class="modal-title"></h4>
</div>
<div class="modal-body">
<form id="add">
<div class="form-group">
<label ><span class="require">*</span>等级名称</label>
<input type="text" class="form-control" name="levelName" id="levelName">
</div>
<div class="form-group">
<label >推广标准</label>
<input type="text" class="form-control" style="80px" name="advertisement" id="advertisement">按昨日交易笔数为标准
</div>
<div class="form-group">
<label >等级佣金</label>
<input type="text" class="form-control" style="80px" name="commission" id="commission">%
</div>
<input type="hidden" name="id" id="id">
<input type="hidden" name="channelId" id="channelId">
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-danger" data-dismiss="modal">&#x3000;确定&#x3000;</button>
<button type="button" class="btn btn-default" data-dismiss="modal">&#x3000;取消&#x3000;</button>
</div>
</div>
</div>
</div>

//显示模态框内容
function showModal(id, classes, text, callback) {
$('#' + id + ' .' + classes).text(text);
$('#' + id).modal({show:true});
$('#' + id + ' .btn-danger')
.off('click')
.on('click', function () {
callback();
})
}

//添加等级
function addGrade() {
showModal('updateModal', 'modal-title', '添加推广等级管理', function () {
return saveGrade("add");
});
}

//修改等级
function modifyGrade() {
var checkedLength = $(".pro").find('input:checked').length;
$('#modifyModal .modal-title').text('系统提示');
if (checkedLength == 0) {
showModal('modifyModal', 'modal-body', '请选择要修改的数据', function () {
});
return false;
}
if (checkedLength > 1) {
showModal('modifyModal', 'modal-body', '只能修改一条数据', function () {
});
return false;
}
if (checkedLength == 1) {

var selt = $(".pro").find('input:checked');
var id = $(selt[0]).attr("level_id");
var showdata = function (data) {
var m = '';
m += '<form id="add"><div class="form-group"><label ><span class="require">*</span>等级名称</label><input type="text" class="form-control" name="levelName" id="levelName" value="' + data.RuleName + '"></div>';
m += '<div class="form-group"><label >推广标准</label><input type="text" class="form-control" style="50px" name="advertisement" id="advertisement" value="' + data.RuleMinQty + '">以上日交易笔数为标准</div>';
m += '<div class="form-group"><label >等级佣金</label><input type="text" class="form-control" style="50px" name="commission" id="commission" value="' + data.RulePercentage + '">%</div>';
m += '<input type="hidden" name="id" id="id"><input type="hidden" name="channelId" id="channelId"></form>';
$('#modifyModal .modal-body').html(m)

$('#modifyModal .modal-title').text('修改等级[' + data.RuleName + "]");

$('#id').val(data.RuleID);
if (data.Is_Default == 0) {
$("#add input[name='isDefault']:eq(1)").removeAttr("checked");
$("#add input[name='isDefault']:eq(0)").attr("checked", 'checked');
}
else {
$("#add input[name='isDefault']:eq(0)").removeAttr("checked");
$("#add input[name='isDefault']:eq(1)").attr("checked", 'checked');
}
$('#modifyModal').modal('show');
$('#modifyModal .modal-footer .btn-danger').off('click').on('click',function(){
return saveGrade("modify");
})
$("#modifyModal").on("hidden",function(e){$(this).removeData('modal');});

}

getGradebyId(id, showdata);

}
}

原文地址:https://www.cnblogs.com/xfcao/p/6406899.html