标签：模态 function checked val bootstrap ec modal 使用 data
<span data-toggle="modal" data-target="#editClassifyModal"><button type="button" value="true" class="btn btn-primary" style="margin-left: 30px">添加</button></span>
<a href="javascript:;" οnclick="return get_classify_info({$val['id']});" class="btn btn-info btn-xs">
<i class="fa fa-pencil"></i>编辑
</a>
<div class="modal fade" id="editClassifyModal" tabindex="-1" role="dialog" aria-labelledby="ClassifyModalLabel">
<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="ClassifyModalLabel">编辑分类</h4>
</div>
<div class="modal-body">
<form method="post" id="form_data_classify">
<input type="hidden" name="id" id="ec_id" value="">
<input type="hidden" name="act" id="ec_act" value="add">
<div class="form-group" style="margin-bottom: 10px;">
<label for="recipient-name" class="control-label">课程分类名:</label>
<input type="text" class="form-control" name="name" id="ec_name">
</div>
<div class="form-group">
<label for="status">状态</label>
<input type="radio" name="status" checked class="ec_status" value="1">开启
<input type="radio" name="status" class="ec_status" value="-1">关闭
<input type="radio" name="status" class="ec_status" value="-2">删除
</div>
</form>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">关闭</button>
<button type="button" class="btn btn-primary" οnclick="edit_classify()">提交</button>
</div>
</div>
</div>
</div>
<script>
//关闭模态框时清空内容
$(function () {
$('#editClassifyModal').on('hide.bs.modal', function () {
// 关闭时清空edit状态为add
$("#ec_act").val("add");
$("#ec_name").val('');
$("#ec_id").val('');
$(".ec_status").eq(0).prop("checked", true);
$(".ec_status").eq(0).siblings().prop("checked", false);
})
});
//修改操作将相应内容获取并放入模态框
function get_classify_info(cid){
$.post('/admin/xxx/editxxx',{ form_data:"id="+cid+"&act=getinfo" }, function (data) {
console.log(data);
if(data['state'] == "success") {
$("#ec_id").val(data.id);
$("#ec_act").val("edit");
$("#ec_name").val(data.name);
//根据返回数据将指定的radio设置为选中状态
var radioObj = $('.ec_status');
for(var i=0; i<radioObj.length;i++){
if(radioObj[i].value == data.status){
radioObj[i].checked = true;
break;
}
radioObj[i].checked = false;
}
$('#editClassifyModal').modal('show');
}
}
);
}
//模态框提交数据
function edit_classify(){
console.log($('#form_data_classify').serialize());
$.ajax({
url: "/admin/xxxx/editxxxx",
data:{
"form_data":$('#form_data_classify').serialize(),
},
type: "post",
success:function(data) {
console.log(data);
if(data['state'] == "success") {
$('#editClassifyModal').modal('hide');
layer.msg(data.info,{ icon: 1,time:1000,shade: [0.3, '#393D49'],shadeClose:true },function(){
window.location.reload();//刷新当前页面
});
}else {
$('#editClassifyModal').modal('hide');
layer.msg(data.info,{ icon: 2,time:1500,shade: [0.3, '#393D49'],shadeClose:true },function(){
window.location.reload();//刷新当前页面
});
}
},
error:function() {
alert('请求出错');
}
});
return false;
}
</script>
标签：模态,function,checked,val,bootstrap,ec,modal,使用,data 来源： https://blog.csdn.net/abiao555/article/details/113536651
本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享； 2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关； 3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关； 4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除； 5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。