bootstrap-table数据导入及设置功能按钮
<script> $(document).ready(function(){ var sid = 0;
//定义函数,返回标签,与下面table初始化关联,这里返回的是一个按钮 function AddFunctionAlty(value,row,index){ var btn = \'<button class="btn btn-primary btn-lg TableEditor" data-toggle="modal" data-target="#myModal">切换状态</button>\'; return[btn] }
//定义按钮功能事件,与下面table初始化关联,为初始化的按钮绑定一个事件 window.operateEvents = { "click .TableEditor":function(e,value,row,index){ sid = row[\'sid\']; }, }
//确认按钮的事件 $(\'#commit-btn\').on(\'click\',function(){ var server_status = $(\'#status_selector\').val(); $.ajax({ url: "change_status", type: "post", data: { \'status\' : server_status, \'sid\' : sid, }, success: function(respondata){ location.reload(); } }); });
//去后端获取数据,及传进table里面 $.ajax({ url: "get_data", type: "get",
success: function(respondata){ respondata = JSON.parse(respondata); $(\'#tbl\').bootstrapTable({ data : respondata, columns : [ { field : \'sid\', title : \'sid\', }, { field : \'name\', title : \'服务器名称\' }, { field : \'maintain\', title : \'状态\', }, { field : \'button\', title : \'操作\', events : operateEvents, formatter : AddFunctionAlty }, ] }); } }); }); </script>
先上一段代码
版权声明:本文为QicongLiang原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。