bootstrap 给table 增加这一行的点击事件?

 我来答
包子baozi1010
推荐于2019-10-19 · TA获得超过1.9万个赞
知道小有建树答主
回答量:145
采纳率:100%
帮助的人:2.1万
展开全部
  • <span style="font-family:'Times New Roman';font-size:18px;">$table.bootstrapTable({  

  • //url: 'json/dev.json',  

  • data: wcssdata,  

  • toolbar: '#toolbar', //工具按钮用哪个容器  

  • //striped: true, //是否显示行间隔色  

  • cache: false, //是否使用缓存,默认为true,所以一般情况下需要设置一下这个属性(*)  

  • pagination: true, //是否显示分页  

  • sortable: true, //是否启用排序  

  • sortOrder: "asc", //排序方式  

  • //queryParams: postQueryParams,//传递参数(*)  

  • //sidePagination: "server",      //分页方式:client客户端分页,server服务端分页(*)  

  • pageSize: 20, //每页的记录行数(*)  

  • pageList: [10, 25, 50, 100], //可供选择的每页的行数(*)  

  • strictSearch: true,  

  • //height: table_h, //行高,如果没有设置height属性,表格自动根据记录条数觉得表格高度,设置了行高后编辑时标头宽度不会随着下面的行改变,且颜色也不会改变????  

  • uniqueId: "id", //每一行的唯一标识,一般为主键列  

  • cardView: false, //是否显示详细视图  

  • detailView: false, //是否显示父子表  

  • paginationHAlign: "left",  

  • singleSelect: true,  

  • //search:true,               //是否显示表格搜索,此搜索是客户端搜索,不会进服务端  

  • //strictSearch: true,  

  • //showColumns: true, //是否显示所有的列  

  • //showRefresh: true, //是否显示刷新按钮  

  • clickToSelect: true, //是否启用点击选中行  

  • paginationPreText: "<<",  

  • paginationNextText: ">>",  

  • columns: [{  

  • checkbox: true,  

  • }, {  

  • field: 'id',  

  • title: '序号',  

  • width: "75px",  

  • }, {  

  • field: 'seq_no',  

  • title: '编号',  

  • }, {  

  • field: 'type',  

  • title: '类型',  

  • }, {  

  • field: 'position',  

  • title: '位置',  

  • }, {  

  • field: 'status',  

  • title: '设备状态',  

  • }, {  

  • field: 'fault',  

  • title: '故障现象',  

  • }, {  

  • field: 'purchase_time',  

  • title: '采购时间',  

  • }, {  

  • field: 'quality_time',  

  • title: '出保时间',  

  • }, {  

  • field: 'maintain_unit',  

  • title: '维护单位',  

  • }, {  

  • field: 'inputer',  

  • title: '录入者',  

  • }, {  

  • field: 'operate',  

  • title: '操作',  

  • width: '80px',  

  • events: operateEvents1,  

  • formatter: operateFormatter  

  • }, ],  

  • /*处理json数据需要配置此项 

  • * responseHandler: function (res) { 

  • return res.rows; 

  • }*/  

  • });</span>  

  • <span style="font-family:'Times New Roman';font-size:18px;">window.operateEvents1 = {  

  • 'click .RoleOfA': function(e, value, row, index) {  

  • detailmodal.open();  

  • $("#dev_id").val(row.id);  

  • $("#seq_no").val(row.seq_no);  

  • $("#dev_pos").val(row.position);  

  • $("#dev_type1").val(row.type);  

  • $("#dev_status").val(row.status);  

  • $("#fault").val(row.fault);  

  • $("#buy_time").val(row.purchase_time);  

  • $("#quality_time").val(row.quality_time);  

  • $("#inputer").val(row.inputer);  

  • $("#maintain_unit").val(row.maintain_unit);  

  • for(var i in row) console.log(i);  

  • }  

  • };  

  • function operateFormatter(value, row, index) {  

  • return [  

  • '<button id="btn_detail" type="button" class="RoleOfA btn-default bt-select">详情</button>',  

  • ].join('');  

  • }</span>  

推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式