H+ 后台管理框架使用心得(持续更新中。。。。)

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/qing_mei_xiu/article/details/83661306

H+/H plus 后台管理框架使用中遇到的一些坑，记录下来，主要是js的使用，以及相关插件

1.bootstarp-switch 开关

我们对Markdown编辑器进行了一些功能拓展与语法支持，除了标准的Markdown编辑器功能，我们增加了如下几点新功能，帮助你用它写博客：

1. 官网地址：http://www.bootcss.com/p/bootstrap-switch/

2. 初始化表格代码

       tableHelper.buildParam = function () {tableHelper.buildParam = function () {
               //tableHelper.parmas["pageIndex"] = pageIndex;
               //tableHelper.parmas["pageSize"] = pageSize;
       }
   
       tableHelper.url = "${base}/opt/role/queryPageList";
       tableHelper.tableId = "role_table";
       
        tableHelper.buildAppend = function (rowData, colums, html) {
   
       if (colums == 'option') {
       var sss = JSON.stringify(rowData)  //整体对象获取
       console.log(sss);
           html = ' <button class="btn btn-success  btn-margin btn-xs"  data-userName="' + rowData[
                           'userName'] + '"  data-id="' + rowData['id'] + '" data-groupId="' + rowData['groupId'] +
                   '"data-nickname="' + rowData['nickName'] + '"data-worktype="' + rowData['worktype'] +
                   '" onclick="save(\''+JSON.stringify(rowData)+'\')">修改</button>';
       }
       if (colums == 'status') {
           html = '<div class="switch" ><input type="checkbox" checked /></div>';
       }
     
       return html;
      }
   

3. switch 初始化

   	tableHelper.fnDrawCallback = function () {tableHelper.fnDrawCallback = function () {
   		
   		console.log("fnDrawCallback");
   	$('.switch input').bootstrapSwitch('toggleState',true);  //初始化
   	
   	$('.switch input').on('switchChange.bootstrapSwitch', function (event,state) {  //事件绑定
   	    console.log(state);
   	    if(state == true){
   	    
   	    }else{
   	    
   	    }
   	    
   	    
   	});	       
     
   }
   

4.别忘了引入相关的js 跟css,事件绑定一定要先渲染，在绑定

<!-- switch 开关 -->
	
<link href="${base}/static/css/switchs/bootstrap-switch.min.css" rel="stylesheet">

<!-- switch 开关 -->
<script src="${base}/static/js/switchs/bootstrap-switch.min.js" ></script>