bootstrap模态框之间的数据交互_bootstrap模态框传值操作

1、bootstrap模态框之html代码

分类管理

分类管理

ID栏目名称操作

1mysql基础

修改

删除

添加分类

×

删除确认

您确认要删除该分类吗？
删除该分类的同时会自动删除该分类下面所有的文章。

删除

取消

×

添加或修改分类

分类名称：

保存

关闭

2、、bootstrap模态框之javascript代码

// 全局变量分类ID

var cateid = 0;

// 打开添加、编辑模态框

$('#infoModal').on('show.bs.modal',function(event){

var button = $(event.relatedTarget);

var modal = $(this);

//获取要操作的ID

cateid = button.data('id');

if(cateid == 0){

$('#catename').val('');

}else{

//把要修改的分类名称显示出来,更多数据可以通过ajax获取

$('#catename').val(button.data('catename'));

}

});

//提交分类添加、修改表单

$('#addoredit').on('click', function () {

//$(this).button('complete'); //button text will be "finished!"

var catename = $("#catename").val();

if (catename == '') {

alert("请输入分类名称！");

return;

}

var action=cateid==0?'add':'edit';

$.ajax({

url:'……',

type:'post',

dataType: 'json',

data:{action:action,cateid:cateid,catename:catename},

error:function(){

alert('出现错误！');

},success:function (data){

if(data.indexOf('error') < 0){

$('#infoModal').modal('hide');

location.reload();

}else{

alert(data);

}

}

});

});

// 打开删除分类模态框

$('#delModal').on('show.bs.modal', function (event) {

var button = $(event.relatedTarget);

cateid = button.data('id');

});

// 提交删除分类

$('#delButton').on('click',function(){

$(this).button('complete');

$.ajax({

url:'',

type:'post',

dataType: 'json',

data:{action:'del',cateid:cateid},

error:function(){

alert('出现错误！');

},success:function(data){

if (data.indexOf('error') < 0){

//模态框隐藏

$('#delModal').modal('hide');

location.reload();

}else{

alert(data);

}

}

});

});